事件代理不按预期工作
问题描述:
我有一个模板,在我的点击事件中,我插入在当前表行后,但问题是当你点击新添加的模板,其中有一个事件按钮类称为.add事件死亡和不工作了它只有一次,当页面加载模板事件代理不按预期工作
$('.variations_grid tr td').delegate('.add', 'click', function(e) {
$(this).closest('tr').after(template);
//the buttons int the template don't work on click event
});
var template = '<tr>';
template += '<td class="white-space:nowrap">';
template += '<input type="hidden" name="variationsid" value="1" />';
template += '<button class="btn btn-default btn-block add" type="button"> <span class="glyphicon glyphicon-plus-sign"></span> </button>';
template += '<button class="btn btn-default btn-block remove" type="button"> <span class="glyphicon glyphicon-minus-sign"></span> </button>';
template += '</td>';
template += '<tr>';
答
随着事件委托的工作,尊重的唯一事情是,在该处理程序放入DOM元素必须不可替代的。因此,您必须选择不会被替换的最近可能的容器。
例如,如果要替换或添加新的<tr>
或<td>
标记,请勿在这些标记上绑定事件处理程序,否则委派将无法工作。
试试这个(我换成delegate
与on
因为delegate
现在已经过时):
$('.variations_grid').on('click', '.add', function(e) {
//your logic
});
谢谢你这么多,你的帮助。我从你身上学到了一些答案我会从现在开始记住它,再次感谢 – ONYX 2014-10-05 01:09:51
@KDM很高兴我能提供帮助。 – plalx 2014-10-05 01:13:45
是的,该方法的作品,以及感谢您的帮助 – ONYX 2014-10-05 01:28:16