jQuery是否有办法手动触发委托(delegate)事件处理程序?
请看以下示例代码:
<div class="container">
<input type="button" value="Hello">
<span class="output"></span>
</div>
<script>
$('.container')
.on('click', '[type=button]', function(e) {
$(e.delegateTarget).find('.output').text($(this).val());
})
.find('[type=button]').triggerHandler('click');
</script>
(在线:http://jsfiddle.net/TcHBE/)
我期望这会起作用,并且文本“Hello”将出现在跨度中,而无需实际单击按钮,但事实并非如此。
我在处理程序中使用了
e.delegateTarget
,因为.ouput
元素除了在.container
内的某些位置之外,与按钮之间没有已知的关系。这就是为什么我首先使用委托(delegate)事件处理程序的原因。更新:
另外,我正在使用
triggerHandler
,因为该事件在我不想触发的真实代码中具有默认行为。 (在真实代码中,该事件是Bootstrap Modal plugin的自定义事件hide
,但是在页面加载时触发事件处理程序时,我实际上并不希望隐藏模式)。我可以将处理程序提取到一个命名函数中,然后直接调用它,但是由于使用了
e.delegateTarget
,这会使方法的构造更加复杂。 最佳答案
您可以手动创建一个Event对象,并相应地设置target
属性,以诱使jQuery认为事件冒泡了。
var c = $('#container');
c.on('click', '[type=button]', function(e) {
$(e.delegateTarget).find('span').text($(this).val());
});
var event = jQuery.Event('click');
event.target = c.find('[type=button]')[0];
c.trigger(event);
http://jsfiddle.net/PCLFx/
关于jquery - 如何使用jQuery手动触发委托(delegate)事件?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/12724147/