使用標題和相關標題值對json資料進行排序

我有這個按姓氏排序的資料陣列

JSON.parse(data).sort(function (a, b) {
      return a.user_last.localeCompare(b.user_last);
});

這是我在排序后得到的樣本：

{"title": "Dr.","first_name": "Pennie","last_name": "Abramson"},
{"title": "Prof.","first_name": "David","last_name": "Amob"},
{"title": "Prof.","first_name": "Dash","last_name": "Arnon"},
{"title": "Prof.","first_name": "Haim","last_name": "Bling"},
{"title": "Prof.","first_name": "Wow","last_name": "Bold"},
{"title": "Dr.","first_name": "Ron","last_name": "bondel"},
{"title": "Dr.","first_name": "katty","last_name": "Contor"},
{"title": "Prof.","first_name": "Ranny","last_name": "Cometon"},
{"title": "Dr.","first_name": "Roven","last_name": "Co"}

我想對標題下的串列中的名稱進行排序

標題 - A 值 last_name 上所有以 A 開頭的 last_names

標題 - B 值 last_name 上所有以 B 開頭的 last_names

標題 - C 以 C 開頭的值 last_name 上的所有 last_names

等等...

這是我現在擁有的代碼..問題是我在每個名字上方都有標題

 $.each(JSON.parse(data), function (i, item) {
                 var letter = JSON.parse(data);
                console.log(JSON.parse(data));
                if(item.socket_id !== '0' && item.user_last.charAt(0) == item.user_last[0].charAt(0) ){
                    $("#watching-window").append('<div >' item.user_last[0].charAt(0) '</div><ul><li>' item.user_title ' ' item.user_first ' ' item.user_last '<li></ul>').fadeIn(400)
                }

            });

我該如何正確訂購

輸出示例

<div class="watching-window" id="watching-window"><div class="letter">A</div><ul><li>Mrs. Pennie Abramson</li><li></li></ul><div class="letter">A</div><ul><li>Mr. Gary M. Abramson</li><li></li></ul><div class="letter">A</div><ul><li>Mr. Alfredo Achar</li><li></li></ul><div class="letter">A</div><ul><li>Dr. Carole Ackermann</li><li></li></ul><div class="letter">A</div><ul><li>Mrs. Karen Aiach</li><li></li></ul><div class="letter">A</div><ul><li>Dr. Mark Alexander</li><li></li></ul><div class="letter">A</div><ul><li>Lord David Alliance</li><li></li></ul><div class="letter">A</div><ul><li>Mr. Ilan Artzi</li><li></li></ul><div class="letter">B</div><ul><li>Prof. Paolo Barbanti</li><li></li></ul><div class="letter">B</div><ul><li>Mr. Stephen Barclay</li><li></li></ul><div class="letter">B</div><ul><li>Prof. Allen J. Bard</li><li></li></ul><div class="letter">B</div><ul><li>Prof. Istvan Barna</li><li></li></ul><div class="letter">B</div><ul><li>Dr. Carolyn Barshall</li><li></li></ul><div class="letter">s</div><ul><li>sdfg 345 sdfg</li><li></li></ul><div class="letter">D</div><ul><li>Mr Demo Demo</li><li></li></ul></div>

uj5u.com熱心網友回復：

您可以存盤字母，如果 ltter 正在更改，請添加新的字母行。

const
    data = [{ title: "Dr.", first_name: "Pennie", last_name: "Abramson" }, { title: "Prof.", first_name: "David", last_name: "Amob" }, { title: "Prof.", first_name: "Dash", last_name: "Arnon" }, { title: "Prof.", first_name: "Haim", last_name: "Bling" }, { title: "Prof.", first_name: "Wow", last_name: "Bold" }, { title: "Dr.", first_name: "Ron", last_name: "bondel" }, { title: "Dr.", first_name: "katty", last_name: "Contor" }, { title: "Prof.", first_name: "Ranny", last_name: "Cometon" }, { title: "Dr.", first_name: "Roven", last_name: "Co" }];

data.forEach(((letter, ul) => o => {
    if (letter !== o.last_name[0].toUpperCase()) {
        letter = o.last_name[0].toUpperCase();
        ul = document.createElement('ul');
        document.body.appendChild(document.createTextNode('Letter '   letter));
        document.body.appendChild(ul);
    }
    const li = document.createElement('li');
    li.innerHTML = o.last_name;
    ul.appendChild(li);
})());

.as-console-wrapper { max-height: 100% !important; top: 0; }

標籤：javascript 查询

上一篇：onhover默認情況下第一個div在js中處于活動狀態

下一篇：如何使用箭頭鍵在網格中的行之間向上/向下移動影像？(JavaScript)