使用 jQuery sortable 以编程方式移动项目，同时仍然触发事件

问题描述

我正在使用 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>

我想以编程方式将

移动到不同的位置.我可以使用以下 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 的更新事件上运行的函数，但是用 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 sortable 以编程方式移动项目，同时仍然触发事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！