JQuery可排序在顶部<li>仅

Question

我正在试图弄清楚如何告诉jquery sortable仅适用于最顶层的li。

<ul id="sortable">
<li id="1">first text
    <ol>
        <li>Just some text
        </li>
        <li>Some more text
            <li>
    </ol>
</li>
<li id="2">second text
</li>

我正在尝试使用基于“id”的排序顺序填充隐藏字段

function fnOrder() {
        var mSortResultsAry = [];
        $("#sortable li").each(function (index) {
            mSortResultsAry.push(this.id);
        });
        $("[id$=hfResults]").val(mSortResultsAry.join(","));

    }

现在正在发生的事情是，它通过DOM进入

只是一些文本

并给它一个值“”。我想让它只穿越最顶层的

。

Answer 1

您可以使用#sortable的{​​{3}}。

var mSortResultsAry = [];

$('#sortable').children().each(function(){
  mSortResultsAry.push(this.id);
});

console.log(mSortResultsAry);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul id="sortable">
  <li id="1">first text
      <ol>
          <li>Just some text
          </li>
          <li>Some more text
              <li>
      </ol>
  </li>
  <li id="2">second text
  </li>
 </ul>

甚至可以搜索有ID的<li>。

var mSortResultsAry = [];

$('li[id]').each(function(){
  mSortResultsAry.push(this.id);
});

console.log(mSortResultsAry);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul id="sortable">
  <li id="1">first text
      <ol>
          <li>Just some text
          </li>
          <li>Some more text
              <li>
      </ol>
  </li>
  <li id="2">second text
  </li>
 </ul>