1

关于 jQuery 事件处理，我有一些不明白的地方。我在使用 jQuery UI可排序小部件时发现了这个问题。我试图在小部件上触发排序事件。

假设我有一个简单的 HTML 列表：

<ul>
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
</ul>

我首先尝试像这样触发排序事件：

$('ul').sortable({
  start: function() { console.log("drag started"); }
});

// No output to the console from this line
$('ul').trigger('sortstart');

这段代码有问题吗？启动回调函数没有被调用……有没有办法触发这个回调？但是，我发现以下方法确实有效：

$('ul').sortable();
$('ul').on('sortstart', function() { console.log('drag started'); });

// This line does cause the console to output 'drag started'
$('ul').trigger('sortstart');

我很想知道为什么第一次尝试失败了。

4

1 回答 1

4

jQuery-UI 小部件事件

jQuery-UI 对其小部件触发的所有事件都使用前缀。对于 ui.sortable 小部件，它widgetEventPrefix是sort. 这是直接取自 jQuery-ui 代码的可排序小部件的初始化信息的一部分：

widgetEventPrefix: "sort"

因此，当可排序小部件在trigger()内部调用一个start事件时，它会触发一个sortstart事件（复合），但这并不意味着它必须监听该事件。

示例 1

第一个示例告诉 jQuery 将回调连接到可排序小部件的 start 方法。这将在调用 start 方法时在内部调用。代码的触发部分 ( $('ul').trigger('sortstart')) 只是触发一个恰好与 jQuery-ui 内部触发的事件同名的事件。jQuery-UI 没有监听这个事件并且不会被这个触发器以任何方式调用。

示例 2

第二个示例是将事件处理程序连接到紧随其后触发的事件；但是，这实际上从未调用可排序小部件的内部代码。

于 2013-10-30T17:47:26.880 回答