为了账号安全,请及时绑定邮箱和手机立即绑定

如何订购与jQuery绑定的事件

如何订购与jQuery绑定的事件

jeck猫 2019-07-10 14:58:48
如何订购与jQuery绑定的事件假设我有一个Web应用程序,它有一个可能包含4个脚本块的页面-我编写的脚本可能在其中一个块中找到,但我不知道哪一个是由控制器处理的。我绑了一些onclick事件的按钮,但我发现,它们有时执行的顺序,我没有预料到。是否有确保秩序的方法,或者你过去是如何处理这个问题的?
查看完整描述

3 回答

?
手掌心

TA贡献1942条经验 获得超3个赞

多年来,我一直试图推广这种过程,但在我的例子中,我只关心链中第一个事件侦听器的顺序。

如果它有任何用处,下面是我的jQuery插件,它绑定的事件侦听器总是在任何其他事件之前触发:

** 使用jQuery更改进行内联更新(谢谢Toskan) **

(function($) {
    $.fn.bindFirst = function(/*String*/ eventType, /*[Object])*/ eventData, /*Function*/ handler) {
        var indexOfDot = eventType.indexOf(".");
        var eventNameSpace = indexOfDot > 0 ? eventType.substring(indexOfDot) : "";

        eventType = indexOfDot > 0 ? eventType.substring(0, indexOfDot) : eventType;
        handler = handler == undefined ? eventData : handler;
        eventData = typeof eventData == "function" ? {} : eventData;

        return this.each(function() {
            var $this = $(this);
            var currentAttrListener = this["on" + eventType];

            if (currentAttrListener) {
                $this.bind(eventType, function(e) {
                    return currentAttrListener(e.originalEvent); 
                });

                this["on" + eventType] = null;
            }

            $this.bind(eventType + eventNameSpace, eventData, handler);

            var allEvents = $this.data("events") || $._data($this[0], "events");
            var typeEvents = allEvents[eventType];
            var newEvent = typeEvents.pop();
            typeEvents.unshift(newEvent);
        });
    };})(jQuery);

要注意的事情:

  • 这还没有经过充分的测试。
  • 它依赖于jQuery框架的内部结构,而不是改变(仅用1.5.2进行了测试)。
  • 除了作为源元素的属性或使用jQueryBIND()和其他相关函数绑定之外,它不一定会在事件侦听器之前触发。


查看完整回答
反对 回复 2019-07-10
?
炎炎设计

TA贡献1808条经验 获得超4个赞

如果顺序很重要,您可以创建自己的事件,并在其他回调触发这些事件时将回调绑定到激发。

$('#mydiv').click(function(e) {
    // maniplate #mydiv ...
    $('#mydiv').trigger('mydiv-manipulated');});$('#mydiv').bind('mydiv-manipulated', function(e) {
    // do more stuff now that #mydiv has been manipulated
    return;});

至少是这样的。


查看完整回答
反对 回复 2019-07-10
  • 3 回答
  • 0 关注
  • 482 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信