我正在使用 jQuery UI sortable
获取页面上的元素列表,每次更改时我都想将这些元素的顺序保存在数据库中。
但是,我遇到了一个奇怪的错误(在我看来就像一个错误):serialize
和 toArray
方法总是从生成的序列化字符串中排除一个项目(或数组)。这始终是当前正在拖动的项目。这意味着从未真正正确跟踪订单。
这是我的 javascript 示例:
$('.setContent').sortable({change:
function(event, ui) {
// Serialise the new order
var newOrder = $('.setContent').sortable('serialize');
// Add the current set id and the action name
newOrder += '&setId='+currentSet+'&action=usrStuff:changeCardsOrder';
// Send the data to the server
$.post('ajax.php', newOrder);
}
});
和 HTML:
<div class="setContent>
<div class="cardSmall" id="card_5">
<div class="hanzi">俄国</div>
<div class="meaning">Russia</div>
</div>
<div class="cardSmall" id="card_4">
<div class="hanzi">韩国</div>
<div class="meaning">Korea</div>
</div>
<div class="cardSmall" id="card_6">
<div class="hanzi">中国</div>
<div class="meaning">China</div>
</div>
<div class="cardSmall" id="card_12">
<div class="hanzi">日本</div>
<div class="meaning">Japan</div>
</div>
<div class="cardSmall" id="card_13">
<div class="hanzi">德国</div>
<div class="meaning">Germany</div>
</div>
<div class="cardSmall" id="card_17">
<div class="hanzi">巴西</div>
<div class="meaning">Brasil</div>
</div>
<div class="cardSmall" id="card_14">
<div class="hanzi">法国</div>
<div class="meaning">France</div>
</div>
<div class="cardSmall" id="card_19">
<div class="hanzi">美国</div>
<div class="meaning">America</div>
</div>
<div class="cardSmall" id="card_16">
<div class="hanzi">英国</div>
<div class="meaning">England</div>
</div>
</div>
因此,在本例中,列表中有九个项目。但是 sortable
方法只会返回大约八个的信息。
那么我该如何解决这个问题呢?
最佳答案
您可能需要 update
事件,而不是 change
事件。
change
会在 during 排序时触发,只要 DOM 中项目的顺序发生变化,即使用户没有放开他们正在移动的项目。 update
在用户更改可排序元素的顺序后 触发。
关于javascript - jQuery UI sortable 的 serialize 方法排除了一项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7055813/