Jquery:如何使一个列表在一组列表中不可排序

时间:2014-07-23 11:22:51

标签: javascript jquery html css jquery-ui

我有一个可排序的<div>。在那个<div>中,有几个可用jQuery排序的<ul>列表。如何制作“第一个”列表&#39;静态所以它不能被排序?

HTML:

<div class="overview" id="sortable">
    <div class="viewport-vertical">
      <div class="viewport">
        <ul class="folders-unsortable">
          <li class="unsortable"><h3>First list (3)</h3></li>
          <li>
            <div>
              <a href="" target="_parent" title="verre si li the fox jumps" class="favorite">verre si li the fox jumps</a>
              <a href="#" title="edit" class="icon icon-wheel edit-item"></a>
            </div>
          </li>
        </ul>
      </div>
    </div>
    <div class="viewport-vertical">
      <div class="viewport">
        <ul class="folders-sortable">
          <li class="unsortable"><h3>Second list</h3></li>
          <li>
            <div>
              <a href="" target="_parent" title="Lorem ipsum dolor" class="favorite">Lorem ipsum dolor</a>
              <a href="#" title="edit" class="icon icon-wheel edit-item"></a>
            </div>
          </li>
         </ul>
      </div>
    </div>
 </div>

jQuery:

<script type="text/javascript">
    $(function(){
      //Folders
      $( "#sortable" ).sortable();
      $( "#sortable" ).disableSelection();

      //Make favorites sortable
      $( ".folders-sortable" ).sortable({
        items: "ul:not(.unsortable)",
        connectWith: ".folders-sortable",
        update: function( event, ui ) {
        if (this === ui.item.parent()[0]) {
              alert("Favorite moved");
          }
      }
      }).disableSelection();

    });
</script>

1 个答案:

答案 0 :(得分:0)

试试这个

 $(function()
{
     $( "#sortable" ).sortable();
     $( "#sortable" ).disableSelection();
    $( "#sortable .folders-sortable" ).sortable();
});