我正在使用 jQuery UI 的 Sortable,我想在更新时调用一个函数。这是我现在正在尝试的代码。
$(".sortable").sortable({
handle: '.handle'
, start: function (event, ui) {
console.log('started sorting ' + $(event.srcElement).index());
prev_sortable_index = $(event.srcElement).index();
$('.sortable li:not(.ui-state-highlight)').each(function () {
prev_list_elements.push($(this));
new_sort_order.push($(this).index());
});
console.log(new_sort_order);
}
, update: function (event, ui) {
alert("testing");
}
});
排序后,我没有收到提醒消息。如果我将“更新”移动到“开始”上方,我会得到相同的结果。我尝试将警报添加到开始事件、停止事件和更新事件。我没有收到任何错误或警告,只是更新事件似乎没有触发。我还确保没有任何 preventDefault 或 stopPropagation 干扰我的目标元素。
编辑:添加 HTML
<ul class="sortable no-margin no-padding" style="list-style:none;">
<li class="item green-row"><span class="handle"><img src="~/Images/handle.png" style="width:14px; margin-top:2px;" /></span>
<table style="width:97%;">
<tr style="background:none;">
<td style="width:130px;">Plan Check Fee</td>
<td style="width:120px;">Plan Check</td>
<td style="width:80px;">-</td>
<td style="width:103px;">$1200.00</td>
<td style="width:113px;">-</td>
<td style="width:92px;">$100.00</td>
<td style="width:100px;">$1100.00</td>
<td style="width:88px;">$1100.00</td>
</tr>
</table>
</li>
<li class="item green-row"><span class="handle"><img src="~/Images/handle.png" style="width:14px; margin-top:2px;" /></span>
<table style="width:97%;">
<tr style="background:none;">
<td style="width:130px;">Plan Check Fee</td>
<td style="width:120px;">Plan Check</td>
<td style="width:80px;">-</td>
<td style="width:103px;">$1200.00</td>
<td style="width:113px;">-</td>
<td style="width:92px;">$100.00</td>
<td style="width:100px;">$1100.00</td>
<td style="width:88px;">$1100.00</td>
</tr>
</table>
</li>
</ul>
最佳答案
我终于能够解决我的问题,事实证明这是 JavaScript 引用中的冲突。我以前使用 jquery.sortable.js,然后回过头来使用 jQuery UI 的排序功能,但未能删除对 jquery.sortable.js 的引用。
关于javascript - jQuery UI 的可排序更新事件未触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26898051/