Jquery 基于标题和类型的附录

我需要根据歌曲的系列标题和类型对歌曲进行排序

我正在使用jQuery UI菜单：

<ul id="menu"></ul>

for(y = 0; y<tytuly.length; y++){
    $('<li><div>'+tytuly[y]+'</div><ul><li><div>Openingi</div><ul id="ops'+y+'"></ul></li><li><div>Endingi</div><ul id="eds'+y+'"></ul></li><li><div>Inserty</div><ul id="ins'+y+'"></ul></li></ul></li>').appendTo('#menu');
}

似乎您有4个没有关系的阵列：

var tytuly = ["title","title2","title3","title4","title5","title6","title7","title8","title9"]; 
var link = ["link","link","link","link","link","link","link","link","link"];
var type = [1,1,2,2,2,3,3,1,1];
var tyt_art = ["test","test","test","test","test","test","test","test","test"];

不建议这样做。我建议将其调整为一组对象

var ty = [{
  title: "title 1",
  link: "link 1",
  type: 1,
  art: "test 1"
},{
  title: "title 2",
  link: "link 2",
  type: 1,
  art: "test 2"
},{
  title: "title 3",
  link: "link 3",
  type: 2,
  art: "test 3"
},{
  title: "title 4",
  link: "link 4",
  type: 2,
  art: "test 4"
},{
  title: "title 5",
  link: "link 5",
  type: 2,
  art: "test 5"
},{
  title: "title 6",
  link: "link 6",
  type: 3,
  art: "test 6"
},{
  title: "title 7",
  link: "link 7",
  type: 3,
  art: "test 7"
},{
  title: "title 8",
  link: "link 8",
  type: 1,
  art: "test 8"
},{
  title: "title 9",
  link: "link 9",
  type: 1,
  art: "test 9"
}];

通过这样安排数据，您可以更轻松地使用它。如果要按特定类型排序，可以使用比较函数使用

.sort（）

进行排序

var-ty=[{
标题：“标题1”，
链接：“链接1”，
类型：“1”，
艺术：“测试1”
}, {
标题：“标题2”，
链接：“链接2”，
类型：“1”，
艺术：“测试2”
}, {
标题：“标题3”，
链接：“链接3”，
类型：“2”，
艺术：“测试3”
}, {
标题：“标题4”，
链接：“链接4”，
类型：“2”，
艺术：“测试4”
}, {
“nr_wpisu”：“1”，
“id”：“39”，
“类型”：“1”，
“链接”：“https:\/\/animethemes.moe\/video\/kakumeikivavrave-OP1.webm”，
艺术：“保存的玫瑰”，
标题：“Kakumeiki Valvrave”
}, {
“nr_wpisu”：“43”，
“id_动画”：“36”，
“类型”：“2”，
“链接”：“https:\/\/animethemes.moe\/video\/MaouGakuinNoFutekigousha-ED1.webm”，
艺术：“Hamidashimono-Tomori Kusunoki”，
标题：“Maou Gakuin no Futekigousha:Shijou Saikyou no Maou no Shiso，Tensei shite Shison tachi no Gakkou e”
}, {
标题：“标题7”，
链接：“链接7”，
类型：“3”，
艺术：“测试7”
},
{
标题：“标题8”，
链接：“链接8”，
类型：“1”，
艺术：“测试8”
}, {
标题：“标题9”，
链接：“链接9”，
类型：“1”，
艺术：“测试9”
}, {
标题：“第一首歌”，
链接：“链接10”，
类型：null，
艺术：“测试10”
}
];
功能弹出菜单（tObj、myData）{
var op=$（“
”）.html（“Openingi”）.appendTo（tObj）；
$（“
”{
id:“op”
})。插入后面（$（“div”，op））；
var ed=$（“
”）.html（“Endingi”）.appendTo（tObj）；
$（“
”{
id:“ed”
})。插入后面（$（“div”，ed））；
var ins=$（“
”）.html（“Inserty”）.appendTo（tObj）；
$（“
”{
id:“ins”
})。插入后面（$（“div”，ins））；
$。每个（我的数据，函数（i，t）{
开关（t型）{
案例“1”：
$（“
”{
类别：“op-”+i
}).附录（$（“ul”，op））；
$('', {
标题：t.art
}).text（t.title）.appendTo（$（'.op-'+i，tObj））；
打破
案例“2”：
$（“
”{
类别：“ed-”+i
})。附录（$（“ul”，ed））；
$('', {
标题：t.art
}).text（t.title）.appendTo（$（'.ed-'+i，tObj））；
打破
案例“3”：
$（“
”{
类别：“ins-”+i
}).附录（$（“ul”，ins））；
$('', {
标题：t.art
}).text（t.title）.appendTo（$（'.ins-'+i，tObj））；
打破
违约：
var s=$（'li>'）。附录（tObj）；
$('', {
标题：t.art
}).文本（t.标题）。附录；
}
});
}
$（函数（）{
popMenu（$（“#菜单”），ty）；
$（“#菜单”）.menu（）；
});
#菜单{
宽度：150px；
}


我正在发布答案，也许有一天会有人需要它：

 var currentTitleNumber;
        var q;
        for(q = 0; q<tytuly.length;q++){
    
     if(q == $.inArray(tytuly[q], tytuly)){
      currentTitleNumber = q;
    for(o = 0; o <=ostlength; o++){
      if(typ[o] == 1 && allTytuly[o] == tytuly[q]){
             $('<li class="op'+o+'"></li>').appendTo('body #ops'+currentTitleNumber);
             $('<div/>').text(tyt_art[o]).appendTo('body .op'+o);
           }
           if(typ[o] == 2 && allTytuly[o] == tytuly[q]){
             $('<li class="ed'+o+'"></li>').appendTo('body #eds'+currentTitleNumber);
             $('<div/>').text(tyt_art[o]).appendTo('body .ed'+o);
           }
           if(typ[o] == 3 && allTytuly[o] == tytuly[q]){
             $('<li class="ins'+o+'"></li>').appendTo('body #ins'+currentTitleNumber);
             $('<div/>').text(tyt_art[o]).appendTo('body .ins'+o);
           }
           
    }
    
     }
              
               }

var当前标题编号；
var-q；
对于（q=0；qI为您制作了一个片段。请向其中添加相关的HTML和CSS，以使@mplungjan doneWelcome发生堆栈溢出。您提供的示例不清楚。您试图按标题和类型排序的数据在哪里。为什么不让您的数据源在提供给AJAX请求之前执行分组和排序？我不知道如何进行排序这样做，对我来说更容易。@Twisty现在应该足够了？我的意思是，我得到了一个JSON数组，看起来像是使用Ajax从PHP加载的对象，我在上面给出了一个数据示例。你这样做，它只是整理了标题，没有“Openingi”、“Endingi”、“Inserty”的小节，以及歌曲的另一个小节。@Nurarihyon根据您的OP，关系不清楚。请查看更新的答案。差不多，但仍然不够。第一部分是系列标题，然后每个标题有3个小节：“Openingi”、“Endingi”和“Inserty”每个小节都包含基于系列标题和歌曲类型的歌曲。@Nurarihyon此时，您应该能够根据自己的需要调整我的示例。如果您确实需要更多帮助，请返回并编辑您的OP，或者显示您希望最终结果的图像屏幕截图。您可能还需要查看：好的，我设法做到了以我的方式去做吧，谢谢你的帮助，也很抱歉你浪费了时间：/