我在通过另一个动作创建的项目上绑定jquery事件时遇到问题,例如当加载更多链接时点击
e.g there are list of elements
在页面加载时,我使用以下jquery脚本来绑定鼠标进入和离开事件.
$('.itm').on({
mouseenter: function (e) {
alert('mouse enter');
},mouseleave: function (e) {
alert('mouse leave');
}
});
这将成功在元素c_1,c_2上应用事件,但是当加载更多链接调用时,它将生成更多元素.为此我取消绑定悬停事件,并在加载更多链接点击时在函数调用下创建新元素时再次绑定它.
$(".cmtldmore").on('click',function (e) {
// Ajax process to load more elements in tray.
// Unbind hover event
$('.itm').off();
// Bind it again
$('.itm').on({
mouseenter: function (e) {
alert('mouse enter');
},mouseleave: function (e) {
alert('mouse leave');
}
});
});
最佳答案
在动态内容上,您需要委托,如下所示:
$(document).on({
mouseenter: function (e) {
alert('mouse enter');
},mouseleave: function (e) {
alert('mouse leave');
}
},'.itm');
您应该使用未使用Ajax插入的最近父级替换document.
原文链接:https://www.f2er.com/html/426390.html