jquery, Attributselektor, erhalten aktuelle Attributwert

Question

Ich habe einen Eingang:

<input type="text" size="5" maxlength="5" decimals="2"> 

wo „Dezimalzahlen“ einen Wert von 0 bis 4

Im onblur Fall sein könnte, was auch immer Anzahl der Benutzer Typen werden geändert, um zu entsprechen, also:

decimals="2" 
User enters: 123.456 
Input is changed to: 123.46 

Das ist trivial, kein Problem. Meine Frage betrifft den effizientesten Weg, um den Wert von "Dezimalzahlen" zu erhalten. Normalerweise würde ich (jquery) schreiben:

$('[decimals]').blur(function(){ 
    val = $(this).attr('decimals'); 
    // *** do stuff with val *** 
}); 

... aber es scheint mir, es sollte ein effizienter Weg, um den Wert von „Dezimalzahlen“ zu bekommen, da wir bereits den Eingang ausgewählt haben, basierend auf dieses Attribut. Gibt es, oder ist mein Code wie geschrieben, der einzige Weg?

Answer 1

Sie können einen Blick auf attributes werfen. Dies ist ein NamedNodeMap mit einigen Funktionen.

Wenn Sie auf Attribute beziehen und nicht auf custom data attributes können Sie tun:

$(function() { 
 
    $('[decimals]').blur(function(){ 
 
    var val = this.attributes.decimals.value; 
 
    var val1 = this.attributes.getNamedItem('decimals').value; 
 
    var val2 = this.getAttribute('decimals'); 
 
    
 
    console.log('this.attributes.decimals.value = ' + val); 
 
    console.log('this.attributes.getNamedItem("decimals").value = ' + val1); 
 
    console.log('this.getAttribute("decimals") = ' + val); 
 
    // *** do stuff with val *** 
 
    }).trigger('blur'); 
 
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 

 
<form> 
 
    <input type="text" size="5" maxlength="5" decimals="2"> 
 
</form>

Stattdessen, wenn Sie benutzerdefinierte Daten beziehen Attribute:

Dezimalstellen =“ 2 "

Benutzereingabe: 123.456

Eingang wird folgendermaßen geändert: 123,46

Sie tun können:

$(function() { 
 
    $('[data-decimals]').on('blur', function(e){ 
 
    var val = +$(this).data('decimals'); 
 

 
    var txtNumber = +this.value; 
 

 
    this.value = txtNumber.toFixed(2); 
 
    }); 
 
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 

 
<form> 
 
    <input type="number" size="5" maxlength="5" data-decimals="2"> 
 
</form>