以jQuery可排序的方式以编程方式移动项目，同时仍触发事件 [英] Moving an item programmatically with jQuery sortable while still triggering events

问题描述

我正在使用jQuery Sortable。我有这样的HTML设置：

I am using jQuery Sortable. I have the HTML setup like so:

<ul id='plan'>
  <li class='item'>1</li>
  <li class='item'>2</li>
  <li class='item'>3</li>
  <li class='item'>4</li>
</ul>

我想以编程方式移动< li> 到不同的位置。我可以使用以下JS实现此目的：

I want to programmatically move an <li> to a different position. I can achieve this with the following JS:

$("#plan li:eq(1)").insertAfter($("#plan li:eq(2)"));

除非它不会触发可更改或更新等可排序事件，否则此工作正常。我有一个在sortable的update事件上运行的函数，但是用JS移动li不会触发它。

This works fine except it does not trigger the sortable events like change or update. I have a function which is run on the update event of the sortable but moving the li with JS does not trigger this.

有谁知道如何触发可排序的更新事件？

Does anyone know how to trigger the sortable update event?

推荐答案

$("selector").trigger("sortupdate");

你必须传入第二个参数作为放置事件的函数和ui ，事件不如ui重要

you will have to maybe pass in as second argument a function where to put in the event and the ui, event is not as important as ui

事件触发的可排序小部件的内部代码如下所示

the inside code of the sortable widget for event triggering looks like this

this._trigger("update", event, this._uiHash(this));

所以你可能想要关注

function triggerUpdateFor(selector) {
    var widget = $(selector).sortable("widget");
    if (widget) widget._trigger("update", null, widget._uiHash(widget));
}

这篇关于以jQuery可排序的方式以编程方式移动项目，同时仍触发事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！