ajax局部刷新之后delegate绑定事件失效

ajax局部刷新之后delegate绑定事件失效

长安忆 发布于 2021-11-30 字数 4929 浏览 788 回复 6

 $(".inner").delegate(

 "div[class='innerDIV']",

 "click",

 function(){

var addressDIV =  $(this).attr("id");

var addressId =  $(this).attr("objId");

alert("addressDIV-------->"+addressDIV);

alert("addressId-------->"+addressId);

var queryUrl =basePath+"/HRTWEB/address/getAddress.do?id="+addressId;

            $.ajax({

url : queryUrl,

dataType : 'json',

cache : false,

success : function(data) {

var address = data.addressBook;

/*alert(address.province);

alert(address.postCode);

alert(address.receiver);*/

$("#receiver").attr("value",address.receiver);

$("#postCode").attr("value",address.postCode);

$("#province").attr("value",address.province);

var tempAddress = address.province + address.city +address.area;

$("#currentAddress").text(tempAddress);

$("#receAddr").val(tempAddress+address.address);

$("#currentReceiver").text(address.receiver);

},

error : function(html) {

alert("出错了");

return;

}

});

$("#"+addressDIV).attr("isselected","selected");

$("#"+addressDIV).css("border","1px red solid");

 

var divTotal = $("div[class='innerDIV']");

 

var divObject = $("div[isselected='false']");

 

 

for(i=0;i<divObject.length;i++){

var temp = $(divObject[i]).attr("id");

$("#"+temp).css("border","");

}

 

for(i=0;i<divTotal.length;i++){

var temp = $(divTotal[i]).attr("id");

$("#"+temp).attr("isselected","false");

}

 

/*$(".curmarker1").css("visibility","visible");

$(".curmarker2").css("visibility","hidden");*/

 });

function dynamicAddress(result){
clearTable();
var addressBookTable = $("#addressBookTable");
 
var rowContent = "<tr><td colspan='2'><div class='inner'><ul>";
for(i=0;i<result.length;i++){
var address = result[i];
rowContent = rowContent+"<li style='padding-top:15px;'>";
if(address.isdefault==0){
rowContent = rowContent+"<div class='innerDIV' id='address"+address.id+"' isselected='false' objId="+address.id+">";
}
else{
rowContent = rowContent+"<div class='innerDIV' id='address"+address.id+"' isselected='false' objId="+address.id+" style='border:1px red solid;'>";
 
}
rowContent = rowContent+"<div><span>"+address.province+"</span><span>"+address.city+"</span><span>(</span><span>"+address.receiver+"收</span><span>)</span></div>";
rowContent = rowContent+"<div><span>"+address.area+"</span><span>"+address.address+"</span><span>"+address.mobile+"</span></div>";
rowContent = rowContent+ "<a href='#' id='editBtn' data-toggle='modal' memberId='"+address.memberId+"' addressId='"+address.id+"'>修改</a><a href='#' addressId='"+address.id+"' memberId='"+address.memberId+"' id='setDefaultBtn'>设为默认</a></div></li>";
 
 
}
rowContent = rowContent+"</ul></div></td></tr>";
 
rowContent = rowContent+"<tr><td class='buyGift' colspan='2'>"
+"<button type='button' id='addBtn' data-toggle='modal' memberId='${hrtMember.id}'>添加新地址</button></td></tr>";
addressBookTable.append(rowContent);
}

/**
* 设置默认地址
*/
$("#publicMain")
.delegate('#setDefaultBtn','click',
function() {
var memberId = $(this).attr("memberId");
var addressId = $(this).attr("addressId");
alert("memberId---------"+memberId);
alert("addressId---------"+addressId);
var editUrl = basePath+"/HRTWEB/address/setDefaultAddress.do";
$.ajax({

url : editUrl,
type : "POST",
dataType : 'json',
data : {
memberId : memberId,
addressId:addressId
},
cache : false,

success : function(data) {
var address = data.address;//返回默认地址
/*alert(address.province);
alert(address.postCode);
alert(address.receiver);*/
$("#receiver").attr("value",address.receiver);
$("#postCode").attr("value",address.postCode);
$("#province").attr("value",address.province);
var tempAddress = address.province + address.city +address.area;
$("#receAddr").val(tempAddress+address.address);
var result = data.addressList;//返回地址列表
dynamicAddress(result);
},
error : function(html) {
alert("Load Data failly");
refresh();
}
});

});

效果图

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(6

做个少女永远怀春 2021-12-01 6 楼

感谢,问题终于解决了。

各自安好 2021-12-01 5 楼

1、新版jQuery是用on()来替代所有绑定、代理事件

2、在ajax更新区块的父级元素或者document.body上面绑定事件即可

3、try

$(document.body).on('click', "div[class='innerDIV']", function(e) {
 
// do ........
});

平定天下 2021-12-01 4 楼

谢谢提醒,下次我会改进。[13]

墨洒年华 2021-12-01 3 楼

引用来自“stardew”的评论

贴得这么乱这么多没人愿意看的

羁拥 2021-12-01 2 楼

引用来自“stardew”的评论

贴得这么乱这么多没人愿意看的

后知后觉 2021-12-01 1 楼

贴得这么乱这么多没人愿意看的