jQuery

Question

के लिए एक DOM एलीमेंट का डेटा संबद्ध कर रहा है एक पिछले जीवन में, मैं कुछ इस तरह किया है हो सकता है:

<a href="#" onclick="f(311);return false;">Click</a><br/> 
<a href="#" onclick="f(412);return false;">Click</a><br/> 
<a href="#" onclick="f(583);return false;">Click</a><br/> 
<a href="#" onclick="f(624);return false;">Click</a><br/> 

अब jQuery के साथ

, मैं कुछ इस तरह कर सकते हैं: सिवाय

<a class="clicker" alt="311">Click</a><br/> 
<a class="clicker" alt="412">Click</a><br/> 
<a class="clicker" alt="583">Click</a><br/> 
<a class="clicker" alt="624">Click</a><br/> 

<script language="javascript" type="text/javascript"> 
    $(".clicker").bind("click", function(e) { 
     e.preventDefault(); 
     f($(this).attr("alt")); 
    }); 
</script> 

कि डीओएम से jQuery तक डेटा पास करने के लिए alt विशेषता का उपयोग करना एक हैक जैसा लगता है, क्योंकि यह इसका इच्छित उद्देश्य नहीं है। JQuery के उपयोग के लिए DOM में डेटा संग्रहीत/छिपाने के लिए यहां सबसे अच्छा अभ्यास क्या है?

Answer 1

JQuery.data आपको एक शब्दकोश को एक DOM तत्व से जोड़ने देता है। इस डेटा jQuery के माध्यम से स्थापित किया जा सकता:

<a class="clicker">Click</a><br/> 
<a class="clicker">Click</a><br/> 
<a class="clicker">Click</a><br/> 
<a class="clicker">Click</a><br/> 

<script language="javascript" type="text/javascript"> 
    var values = new Array("311", "412", "583", "624"); 
    $(".clicker").each(function(i, e) { 
     $(this).data('value', values[i]).click(function(e) { 
     f($(this).data('value')); 
     }); 
    }); 
</script> 

या HTML5 data- attributes, जो गैर एचटीएमएल 5 के दस्तावेजों में भी काम का उपयोग कर (jQuery 1.4.3 के बाद से):

<a class="clicker" data-value="311">Click</a><br/> 
<a class="clicker" data-value="412">Click</a><br/> 
<a class="clicker" data-value="583">Click</a><br/> 
<a class="clicker" data-value="624">Click</a><br/> 

<script language="javascript" type="text/javascript"> 
    $(".clicker").click(function(e) { 
     f($(this).data('value')); 
    }); 
</script> 

Answer 2

आप "क्लिकर-123" जैसी आईडी विशेषता का उपयोग कर सकते हैं और फिर नंबर को पार्स कर सकते हैं। मैं आमतौर पर ऐसा करता हूं या 'रिलायंस' विशेषता का उपयोग करता हूं।

तो, संक्षेप में, ऐसा करने का कोई बेहतर तरीका नहीं है जिसे मैं जानता हूं। मुझे उम्मीद है कि यह धागा मुझे गलत साबित करता है।

Answer 3

मैं माफी चाहता हूँ, लेकिन अगर आप पहले से ही alt टैग भर रहे हैं, मैं यह देखने में असफल रहा कि ऑनक्लिक हैंडलर के असाइनमेंट में देरी करने में देरी से वास्तव में आपको कुछ भी खरीदता है। क्या यह सिर्फ एक मामला नहीं है "अब मेरे पास हथौड़ा है, हर समस्या एक नाखून की तरह दिखती है।" मुझे लगता है कि जब jQuery सामग्री को स्वाभाविक रूप से सामग्री से प्राप्त किया जा सकता है, उदाहरण के लिए, कक्षा परिभाषा, टैग प्रकार, आदि

Answer 4

आप एक नई सुविधा का सबसे अच्छा उपयोग करेंगे, तो jquery विधि का सबसे अच्छा उपयोग किया जाता है। एचटीएमएल 5: data-...-सामग्री।

अपने HTML- कोड इस तरह दिखेगा:

<a class="clicker" data-mynumber="311">Click</a> 

तो फिर तुम el.attr('data-mynumber') का उपयोग डेटा प्राप्त कर सकते हैं।

संख्या के बजाय, आप कोई भी नाम चुन सकते हैं।

यह सभी ब्राउज़रों में काम करता है।