jQuery UI's未激发可排序更新事件

jQuery UI's Sortable update event not firing

本文关键字:排序 更新 事件 UI jQuery      更新时间:2023-09-26

我正在使用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.sortal.js,然后又重新使用jQueryUI排序的排序功能,但未能删除对jquery.sportal.js.

的引用