为 jQuery“可排序”重新排​​序 li 元素问题

发布于 2024-11-03 06:12:47 字数 726 浏览 2 评论 0原文

我已经使用 jQuery UI 的可排序功能构建了一个可排序列表,这工作正常,只是我需要能够根据包含元素顺序的字符串在开头重新排序

  • 但我无法弄清楚如何使用 JavaScript 执行此操作的语法。
  • 假设我有以下内容:

    <ul>
       <li id="A" >Apple</li>
       <li id="B" >Banana</li>
       <li id="C" >Carrot</li>
    </ul>
    

    和字符串“C,A,B”

    我想要一个 JavaScript 函数来重新排序其中的项目,该函数基于字符串的顺序进行排序。最终结果是:

     <ul>
       <li id="C" >Carrot</li>
       <li id="A" >Apple</li>
       <li id="B" >Banana</li>
    </ul>
    

    我将自然地用“,”将字符串拆分出来,并最终得到一个元素 Id 数组,但我不确定其中的两个主要内容。

    1)获取指定 Id 在分割字符串数组中找到的元素的最佳方法是什么?

    2)一旦我获得了该元素并确定它是正确的元素,将它们按正确顺序放置的语法或最佳策略是什么?

    I have built a sortable list using jQuery UI's sortable feature, this is working fine except that I need to be able to reorder the <li> at the beginning depending upon a string containing the element's order but I cannot figure out the syntax how to do this with JavaScript.

    Lets say I have the following:

    <ul>
       <li id="A" >Apple</li>
       <li id="B" >Banana</li>
       <li id="C" >Carrot</li>
    </ul>
    

    and the string "C,A,B"

    I would like to have a JavaScript function for reordering my the items inside the which bases the ordering off of the order of the string. Ending up with this:

     <ul>
       <li id="C" >Carrot</li>
       <li id="A" >Apple</li>
       <li id="B" >Banana</li>
    </ul>
    

    I will be naturally splitting the string back out by its "," and ending up with an array of element Id's, but I am unsure of two main things in this.

    1) What is the best way to get the element which the specified Id found in my split string array?

    2) Once I have gotten that element and determined it is the correct element, what is the syntax for or best strategy for placing them in the proper order?

    如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

    扫码二维码加入Web技术交流群

    发布评论

    需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

    评论(1

    你穿错了嫁妆 2024-11-10 06:12:47

    这应该回答(1)和(2)。

    您可以在 , 分隔符上拆分字符串以获取数组,然后循环更改 li 元素的顺序。

    var order = 'C,A,B'.split(','),
        ul = $('ul');
    
    $.each(order, function(index, sort) {
        $('#' + sort).appendTo(ul);
    });
    

    jsFiddle

    This should answer both (1) and (2).

    You can split the string on the , delimiter to get an array, and then just loop through changing the order of the li elements.

    var order = 'C,A,B'.split(','),
        ul = $('ul');
    
    $.each(order, function(index, sort) {
        $('#' + sort).appendTo(ul);
    });
    

    jsFiddle.

    ~没有更多了~
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文