Question

我得到一个链接列表（错误消息），指向页面中的控件。链接的顺序与指向的控件不同。我想重新排序我的链接。

示例：

＆＃13;

$(function() {
   //reorder errorList,
   // getOrder(idcontrol){???}
});

＆＃13;

input, select,a {
  display:table;
  }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h3>The original list or errors.</h3>
<div id="errorList">
        <a data-idcontrol="textbox2">error textbox2</a>
        <a data-idcontrol="list3">error list3</a>
        <a data-idcontrol="textbox1">error textbox1</a>
        <a data-idcontrol="textbox2">error textbox2</a>
        <a data-idcontrol="list1">error list1</a>
    </div>

<h3>Elements in the page</h3>
    <input type="text" id="textbox1"/>
    <input type="text" id="textbox2"/>
    <select id="list1"><option>item1</option></select>
    <input type="text" id="textbox3"/>
    <select id="list2"><option>item1</option></select>
    <select id="list3"><option>item1</option></select>


<h3>What should be the list of errors after been reordered.</h3>
<div id="errorListShouldBeAfterReorderOnLoad">
         <a data-idcontrol="textbox1">error textbox1</a>
            <a data-idcontrol="textbox2">error textbox2</a>
            <a data-idcontrol="textbox2">error textbox2</a>
            <a data-idcontrol="list1">error list1</a>
            <a data-idcontrol="list3">error list3</a>
    </div>

＆＃13;

Answer 1

您可以根据其所属元素的索引对错误进行排序

$('#errorList a').sort(function(a,b) {
    var data1  = $(a).data('idcontrol'),
        data2  = $(b).data('idcontrol'),
        index1 = $('#' + data1).index(),
        index2 = $('#' + data2).index();

    return index1 - index2;
}).appendTo('#errorList');

如何按页面中的简单层次排序列表项

1 个答案: