【问题标题】:Managing multiple event handlers in jQuery在 jQuery 中管理多个事件处理程序
【发布时间】:2012-03-02 04:05:37
【问题描述】:

我正在处理一个表单,当输入失去焦点时需要触发多个事件,即触发模糊事件。我无法管理需要响应的各种事件处理程序的顺序被调用。

每个表单输入标记都需要在模糊时发生各种事情。

  1. 各种自动格式化程序,例如确保名称以大写字母开头或根据复选框显示表单区域。
  2. jQuery 验证。
  3. 后验证函数,例如 ajax 调用

到目前为止,我想出的最好方法是依靠事件冒泡系统。因此,请确保使用 jQuery.on() 将第 1 点中的所有事件附加到比验证规则更深入 DOM 的元素。 Jquery 验证将事件侦听器附加到表单元素。

虽然这行得通,但它有几个问题。它适用于我拥有的 3 类事件,当我拥有更多事件时,它很可能会成为问题。

是否有一种发布者/订阅者类型的系统可供人们与 jQuery 一起使用以使这种事情变得更容易?

【问题讨论】:

  • 我通常只对每个元素使用一个事件,并在该事件中执行所有不同的方法。

标签: javascript event-handling jquery-validate jquery


【解决方案1】:

您是否查看过自定义事件并触发了这些事件?

例如,您可以在完成模糊代码后创建自定义“getMeMore”事件:

$(document).on('blur', '.myInputClass', function(){
    // do stuff for blur here
    $(this).trigger('getMeMore');//now trigger my event
});
$(document).on('getMeMore','.myInputClass',function(){
    //do my ajax to get me more here
});

编辑:基于评论:

选择器中的文档只是实时事件的事件锚。请参阅此示例http://jsfiddle.net/MarkSchultheiss/qM2Mv/,其中我根据条件在另一个事件中触发自定义事件。观察数字(它翻倍)以查看其他事件何时触发。我知道它是被解释的,但希望它能给你一些工作。我在我的代码中执行此操作,以便我可以根据在给定时间一个事件触发时可能存在或不存在的其他条件来管理“何时”事件触发。这允许将事件触发器与事件管理分开,这就是这里的重点。注意我在哪里触发了来自不同地方的一些自定义事件。 (复选框值,并基于文本条目的长度)

【讨论】:

  • 我确实想过这样做,但认为这只是在转移问题。这是因为您仍然必须从某个地方触发自定义事件,这里您是从文档级别执行的。如果有机会的话,我以后就不能再开火了。该方法是依靠事件的冒泡来改变执行顺序。
  • @MattBate - 查看我添加的示例
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2010-12-02
  • 1970-01-01
  • 2014-09-10
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多