gpt4 book ai didi

javascript - jQuery 小部件的全局与本地事件处理程序绑定(bind)

转载 作者:搜寻专家 更新时间:2023-11-01 04:42:03 25 4
gpt4 key购买 nike

<分区>

我尝试使用具有丰富功能的 jquery 创建自定义小部件,因此我需要为许多标准事件(例如 dblclick、click、focus、blur 等)自定义处理程序。

我可以应用以下两种策略之一:

  1. 使用 $(document).on('click', '.widget-name .element-class', handle_click);
    全局一次,其中 handle_click 是处理程序函数

  2. 使用$(widget-element).find('.element-class').on('click', handle_click)
    在创建每个小部件实例期间

  3. 像这样绑定(bind)到封闭元素:

    $(this.element)._on('点击', 函数(事件){
    var $this = $(this);
    if($this.is('.element-class')){ handle_click(this, event);
    否则如果($this.is(...)){...}
    ...
    });

哪种方法是更好的设计?
我知道一般来说“这取决于”,所以让我添加一些限制条件:

一个。该小部件通常由约 100 个 DOM 元素组成,这些元素具有专门处理的不同事件。
b.小部件通常不会被销毁并再次创建,只是有时会隐藏起来。
C。通常会加载 1-3 个小部件实例。
d.元素将根据用户请求动态添加,但同时只能<10个
e.在小部件中启用了拖放功能,可能涉及同时重新定位约 20 多个 DOM 元素。
F。小部件本身通常不可拖动。

由于定义了许多单独的事件处理程序,方法 2 是否有显着的性能(或大量内存)损失?(是的,这可能取决于我所知道的浏览器实现。)

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