如何以编程方式触发带按钮的可排序小部件的更新回调？

根据这个jsbin，我有一个sortable列表和一个按钮。 当点击按钮的东西添加到sortable ，我想知道哪个sortable事件被触发？（更新，接收），当找到事件时，在该事件上做一些事情。

例如，如果用户点击add按钮我想知道哪个事件被触发并在事件上做某事。 例如，如果更新火我在可排序的更新方法中做了一些事情

 $('.sort').sortable({ update:function(){ //if update fire do some thing } }); $('#add').click(function(){ $('.sort').append('
Text
'); }); 

Answer 1

问题

将update回调定义为sortable窗口小部件选项的一部分时，名为sortupdate的事件不会绑定到窗口小部件。 换句话说，确实调用了update选项定义的回调函数，但在这种情况下不会触发该名称的事件。

解决方案

如果您希望手动触发事件，还需要手动绑定它。 请注意，事件也将由窗口小部件的常规行为自动触发（例如，用户对窗口小部件中的元素进行排序）。

例如：

HTML

 
 Add 

JS

  // Instantiate the widget $('.sort').sortable(); // Bind the update event manually $('.sort').on('sortupdate',function() {console.log('update')}); $('#add').click(function(){ $('.sort').trigger('sortupdate'); // Trigger the update event manually }); 

参见JS Bin Demo

Answer 2

使用sortable中的option方法（检索其回调）

由于更新回调被定义为可排序小部件的一个选项 ，因此可以通过调用option方法来检索它：

 $('.sort').sortable('option', 'update'); 

更新回调需要两个参数 ，即event和ui object 。 该event可以设置为null，并且需要使用update callback所需的所有属性来定义ui object ：

 $('#add').click(function() { $('.sort').sortable('option','update')(null, { item: $('
new item
').appendTo($('.sort')) }); }); 

工作JS-Fiddle