2013-02-26 13 views
8

मैं onchange से select बाध्यकारी में थोड़ा उलझन में हूं। मैं देख सकता हूं कि ऐसा करने के कई तरीके हैं।ड्रॉपडाउन के लिए बाध्यकारी

एचटीएमएल

<select id="ddl" onchange="test()"></select> 

jQuery

$(function(){ 

    $("#ddl").change(function(){ 
       return test(); 
      }); 

}); 

या

$(function(){ 

    $("#ddl").bind("change", function(){ 
       return test(); 
      }); 

}); 

इन 3 तरीकों के अलावा

0,123,
  1. कौन सा मानक अभ्यास के रूप में माना जाता है?
  2. क्या इनमें से किसी भी तरीके से कोई योग्यता है?
+0

http: // stackoverflow.com/questions/937039/what-is-the-difference-between-the-bind-and-live-methods-in-jquery आपकी मदद करता है .. – sasi

उत्तर

12

तुम भी उपयोग कर सकते हैं .on

$('SELECT').on('change',function(){ 
    // code 
}); 

jQuery 1.7 से पहले, change() बस bind("change") के लिए एक ही समाप्त हो गया।

1.7 के अनुसार, on()bind("change") को बदल दिया गया है, so change() इसके बजाए एक शॉर्टकट है।

इसलिए सबसे अच्छा तरीका या तो होगा;

$("SELECT").bind("change", function(e) {}); 
$("SELECT").on("change", function(e) {}); 

मैं के रूप में यह भी करने के लिए गतिशील रूप से DOM उत्पन्न स्वचालित रूप से लागू कर सकते हैं 2 विकल्प पसंद करते हैं।

2

सभी उल्लिखित jquery विधियों के बराबर प्रतीत होता है, मैं आपके कोड को पढ़ने में आसान बनाने के लिए .change() का उपयोग करने का सुझाव दूंगा।

मैंने अनुभव किया है कि एचटीएमएल ऑनचेंज = "" jquery बाध्य घटनाओं द्वारा पुनः लिखा गया है, लेकिन jquery .change() पर एकाधिक कॉलिंग हैंडलर को आमतौर पर व्यवहार करना चाहते हैं।

कोड को साफ करने के लिए, मैं केवल सरल प्रोग्रामों में एचटीएमएल एक्सचेंज प्रॉपर्टी का उपयोग कर रहा हूं, जो मुझे पता है कि इसमें कई ईवेंट हैंडलर नहीं होंगे और अंदर कोड वास्तव में आसान है (आमतौर पर एक फ़ंक्शन)।

0

हर बार <select> को पुनर्निर्मित करने के बजाय, आप इसके बजाय अपनी सामग्री (<option> तत्वों की सूची) को स्वैप करने से बेहतर हैं।

तो जैसा कि आप पहले से ही कर रहे हैं इस का उपयोग करें:

$("#ItemsPerPage").change(function(e) { return updatePaging(); }); 

लेकिन जब आप इसे अद्यतन, बस उसकी सामग्री (जहां newSelectElement नई <select> तत्व है) बाहर स्वैप:

function updateItemsPerPage(newSelectElement) { 
    $("#ItemsPerPage").empty().append(newSelectElement.childNodes); 
} 
संबंधित मुद्दे