我用下面的方式从jquery发送了一部分html代码
htmlCode1 = "<div class='txt_center'>\
<input type='button' class='btn_view b widthauto' value='Add' name='addShortlist'\ style='cursor:pointer;'";\
htmlCode1 += " id=add"+this.id+" >\
</div>";在这里,我在html中分配了一个id和一个名称,并希望在单击这些id时执行某些函数,但不知何故,我的onclick函数无法执行。这个问题的解决方案是什么?
我将onclick函数调用为:
$("[name='addShortlist']").click(
function()
{
alert("here");
return false;
}
);发布于 2012-08-03 20:49:08
向动态添加的内容注册事件处理程序的解决方案是event delegation,它使用.on() (jQuery 1.7+)或.delegate()函数。基本原则是将事件处理程序绑定到静态元素(最糟糕的情况是整个文档),只有当事件来自与选择器匹配的元素时,该静态元素才会执行回调函数。
一般的代码如下所示:
$(document).on('click', '[name="addShortlist"]', function() {
alert("here");
return false;
});这样,无论何时单击与选择器事件匹配的元素-如果它是在代码执行后添加的-它仍将执行回调函数。
有关详细信息,请阅读.on()文档中标题为直接和委托事件的部分。
更新
如果您使用的jQuery版本没有访问事件委派函数的任何(即在jQuery 1.3之前添加.live()时),那么您真正有的唯一选择就是执行以下操作:
$(function() {
function handleClick() {
alert("here");
return false;
}
function bindClicks() {
$("[name='addShortlist']").unbind('click', handleClick).click(handleClick);
}
$("#test-button').click(function(e) {
// dynamically add some content
bindClicks();
});
});这会将匿名回调函数转换为命名函数(以便可以传递对它的引用),将事件处理程序的绑定包装到函数中(以便可以轻松地从许多位置调用它),并添加对.unbind()的调用,以便在将事件处理程序重新绑定到现在与选择器匹配的所有元素之前,从以前存在的元素(上次调用该函数时存在的元素)中删除任何相同的事件处理程序。
https://stackoverflow.com/questions/11795936
复制相似问题