jquery綁定的事件對ajax刷新出的數據不生效,on可能受jquery版本影響
問題:jquery綁定的事件對ajax刷新出的數據不生效
方法:可以用 jquery 裏面的 on 和 delegate 預綁定父元素就可以觸發的。
註意:某些限制下,個人用的是jquery 1.4.2版本,還不能更新到 1.7版本,on 綁定是報錯的,用 delegate 可以的。
on對jquery 看網上資料是需要 1.7以後版本才支持,具體沒試驗。
案例:
搜索新數據,調用choic.php 將key傳過去獲取搜索內容返回到arcz裏面。將 arcz 裏面新刷新出來的選中的 復選框 一旦選中添加到 arcx裏面去
(可以多次搜索添加,將最後arcx 裏面的值統一調用就好)
搜索:<input type=‘input‘ name=‘key‘> <input type=‘submit‘ value=‘提交‘ id=‘xuan‘>
<ul id=‘arcz‘>
<li><input name=‘checkarc‘ type=‘checkbox‘>111</li>
<li><input name=‘checkarc‘ type=‘checkbox‘>222</li>
<li><input name=‘checkarc‘ type=‘checkbox‘>333</li>
</ul>
<ul id=‘arcx‘>
</ul>
<script type="text/javascript">
$("#arcz").delegate("input","change",function(){
if($(this).is(‘:checked‘)){
var v = $(this).val();
var txt = $(this).parent(‘li‘).text();
$("#arcx").append(‘<li><input type="checkbox" name="checkarc" value="‘+v+‘" checked="checked">‘+txt+‘</li>‘);
}
});
</script>
<script type="text/javascript">
$(‘#xuan‘).click(function(){
var key = $(‘input[name="key"]‘).val();
$.post(
‘choice.php‘,
{‘key‘:key},
function(msg){
$("#arcz").empty();
var x = eval(‘(‘+msg+‘)‘);
$.each(x,function(i,m){
$("#arcz").append(‘<li><input type="checkbox" value="‘+m.id+‘">‘+m.title+‘</li>‘);
})
}
);
})
</script>
其他知識點:
1、$(this).is(‘:checked‘) 判斷是選中事件,change包括選中和取消選中。
2、獲取選中元素及過濾js 數組 重復元素(本文字下面)
最後獲取 arcx 裏面 str 值:
var arr = new Array();
$(‘#arcx input[name="checkarc"]‘).each(function(i){
if(this.checked==true){
arr.push($(this).val());
}
});
var new_arr=[];
//去jquery重復數組元素
for(var i=0;i<arr.length;i++){
var items=arr[i];
if($.inArray(items,new_arr)==-1){
new_arr.push(items);
}
}
var str = new_arr.join(‘,‘);
jquery綁定的事件對ajax刷新出的數據不生效,on可能受jquery版本影響