4

我正在尝试设置一个全局事件绑定器，$(document)它根植于我的所有核心应用程序功能。

我正在使用一些 jQueryUI 小部件（来自 jQuery Mobile），并希望我也可以在我的全局处理程序中包含小部件事件。

所以我正在尝试这样做：

 $(document).on("click change filterablebeforefilter", ".action_elements", function (e) {
   // foo
 });

但是，这不起作用。我可以在我的小部件input事件上设置单击和更改侦听器，但filterablebeforefilter不能这样设置。至少我不能让它工作。

JQM演示仅指定直接绑定：

 $( ".selector" ).on( "filterablebeforefilter", function( e, data ) {
  // foo
 });

问题：
但我想知道是否没有办法将事件附加到document？

谢谢！

4

1 回答 1

0

$(document) 上的自定义事件处理程序确实有效：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>OnEventHandler</title>
    <script src="Scripts/jquery-2.1.0.min.js"></script>
    <script language="javascript" type="text/javascript">
        $(document).ready(function () {
            $(document).on('click filterEvent', '.action_element', function () {
                alert('You Clicked Me!');
            });
            $('#OrderFilter').change(function () {
                $('#CustomerFilter').trigger('filterEvent');
            });
            $('#CustomerFilter').on('filterEvent', function () {
                alert('CustomerFilter filterEvent');
            });
        });
    </script>
</head>
<body>
    <p>Some text.</p>
    <p class="action_element">Click me!</p>
    <select id="OrderFilter">
        <option>By Order Id</option>
        <option>By Order Total</option>
    </select>
    <p id="CustomerFilter" class="action_element">Just some Text...</p>
</body>
</html>

您可以使用 $(document).on('event', 'selector') 为自定义事件委托处理程序。

编辑

因此，这排除了自定义事件传播到文档级别并由那里的委托事件处理程序处理的任何可疑事件。

查看JQM 过滤器和您的问题，您是否在问：如果他们单击输入框或输入框发生更改，或者小部件在开始对某些数据应用过滤之前就正确，则执行 function(){...} ?

如果意图是覆盖过滤过程以获取一些要过滤的数据，则在过滤完成之前，如文档所述；首先来自数据库（想到谷歌搜索......）它适用于手头的小部件是否有意义？如果您在应用程序中有多个小部件，您是否希望所有小部件都具有相同的数据数据库调用（例如同一页面上的 4 个谷歌搜索输入框？）

有意义的是，每个小部件的 beforefilter 事件必须是唯一的（想想 3 个文本框，一个用于 google，一个用于 yahoo，一个用于 bing）。如果是这样，我还不知道他们是如何做到这一点的（但我会尝试，因为我有兴趣知道......）

此外，在过滤器启动之前有 250 毫秒的延迟，因此它等待查看用户是否完成输入......随着更改事件也被委托，处理程序将为它执行，并完成或在路上当触发 beforefilter 事件时要在 250 毫秒后完成……所以处理程序被执行两次？不管有没有，有意义吗？

我猜，他们有它，所以每个小部件只能有一个 beforefilter 事件处理程序，按如上所述的设计。另请注意，在文档示例中，它们使用 .on() 的直接绑定表示法（未指定选择器）。一切都指向一个元素的绑定，而不是委托。

于 2014-01-26T07:33:14.197 回答