gpt4 book ai didi

javascript - Jquery 中的 bindType 与 delegateType

转载 作者:行者123 更新时间:2023-12-03 10:17:13 25 4
gpt4 key购买 nike

嘿伙计们,我刚刚浏览了 Jquery 文档,基本上遇到了以下代码:

jQuery.event.special.pushy = {
bindType: "click",
delegateType: "click"
};

该文档对 bindTypedelegateType 有以下解释,

When defined, these string properties specify that a special event should be handled like another event type until the event is delivered. The bindType is used if the event is attached directly, and the delegateType is used for delegated events. These types are generally DOM event types, and should not be a special event themselves.

现在我不明白以下内容:

如果直接附加事件,则使用bindType,并且 delegateType 用于委托(delegate)事件。

什么是直接附加委托(delegate)事件

谢谢。

亚历克斯-z

最佳答案

考虑 this brilliant article 中的示例:

HTML

<html>
<body>
<div id="container">
<ul id="list">
<li><a href="http://domain1.com">Item #1</a></li>
<li><a href="/local/path/1">Item #2</a></li>
<li><a href="/local/path/2">Item #3</a></li>
<li><a href="http://domain4.com">Item #4</a></li>
</ul>
</div>
</body>
</html>

JS(直接绑定(bind))

// Attach a directly bound event handler
$( "#list a" ).on( "click", function( event ) {
event.preventDefault();
console.log( $( this ).text() );
});

JS(委托(delegate)绑定(bind))

// Attach a delegated event handler
$( "#list" ).on( "click", "a", function( event ) {
event.preventDefault();
console.log( $( this ).text() );
});

Event delegation refers to the process of using event propagation (bubbling) to handle events at a higher level in the DOM than the element on which the event originated. It allows us to attach a single event listener for elements that exist now or in the future.

关于javascript - Jquery 中的 bindType 与 delegateType,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29809367/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com