javascript - JQuery UI .sortable ('toArray' )返回 HTMLUListElement 而不是 id 数组

Question

我试图用可排序元素创建一个排序数组，但“toArray”方法不起作用。这是我的可排序 html 代码:

<div class="control-group" style="cursor:pointer;">
    <label class="control-label" for="input-sort">Preferences</label>
            <div class="controls">
            <ul id= "sortable">
                    <li class="ui-state-default" id="Item1"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 1</li>
                    <li class="ui-state-default" id="Item2"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2</li>
                    <li class="ui-state-default" id="Item3"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3</li>
                    <li class="ui-state-default" id="Item4"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 4</li>
                    <li class="ui-state-default" id="Item5"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 5</li>
                    <li class="ui-state-default" id="Item6"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 6</li>
                    <li class="ui-state-default" id="Item7"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 7</li>
            </ul>
            </div>
    </div>

这是相应的 JavaScript:

<script>
    var result=$("#sortable").sortable("toArray");
    $("#sortable").sortable({
        stop: function(event, ui) {
            document.getElementById("info").innerHTML=result + " and " + result[0];
        }
    });
</script>

当我显示结果时，它返回 [object Object] 和 [object HTMLLIElement]，我什至尝试将结果分配给 $("sortable li") 但它没有返回任何元素。任何帮助表示赞赏。谢谢。

Answer 1

你的代码没有任何逻辑意义，但我认为这就是你想要的。

$("#sortable").sortable({
    stop: function(event, ui) {
        $("#info").html(JSON.stringify($("#sortable").sortable('toArray')));
    }
});

但请注意，除非您包含 JSON 库，否则它在 IE<8 中不起作用。

在您的代码中，结果永远不会更新，因此它将始终包含 jquery 对象，该对象始终是一个对象而不是值数组。