如何檢測選擇列表中的更改？

Question

我有一個按鈕，可以創建2個選擇列表。

$(document).ready(function(){ 
$("input[name$='addcriteria']").on('click', function() { 
    var newrow = $("<p>Where <select name='fieldname' class='fieldname'></select>   
    is <select name='paperSession' class='options'></select></p>"); 

    //--Some other codes that declares the option values of the select field--// 

    }); 
}); //End of Document ready 

接下來，我想檢測當我選擇列表時創建的操作。

$(".fieldname").on('change',function(){ 
     alert("testing"); 
    }); 

問題是：我應該把這個動作放在$document).ready(function(){下嗎？

Answer 1

那麼，這將是很好的做法，如果你寫在$(document).ready(function(){})的功能：

當你添加新的行動態嘗試.on()

$(document).on('change','.fieldname',function(){ 
     alert("testing"); 
    }); 

OR

$(document.body).on('change','.fieldname',function(){ 
     alert("testing"); 
    }); 

事件代表團

這裏document/document.body指的是c losest父元素

Answer 2

嘗試：

$(document).on("change",".fieldname",function(){ 
    alert("testing"); 
}); 

Answer 3

我應該把這個動作的$下（文件）。就緒（函數（）{ ？

是的，你需要把它放在$(document).ready()裏面。此外，由於select元素動態添加，你需要使用event delegation註冊事件處理程序，如：

// New way (jQuery 1.7+) - .on(events, selector, handler) 
$(document).on('change', '.fieldname', function() { 
    alert("testing"); 
});