[英]sort li elements using javascript or jquery
在我的頁面中我有下面的內容。 我需要使用javascript對其進行排序。
<li class="cat2 lang1">Hello</li>
<li class="cat2 lang1">Hello</li>
<li class="cat1 lang2">Hello</li>
<li class="cat3 lang3">Hello</li>
我試過的是:
$('#movieFeatureFilter span#selGenre .subMenus li').click(function()
{
if(this.id != '')
{
$('.movie_lists ul li').hide();
$('.movie_lists ul li.cat'+this.id).show();
}
else $('.movie_lists ul li').show();
});
這很完美。 但我需要使用lang和cat的組合對列表進行排序。
也就是說,如果我選擇CAT1的類別和LANG2如語言,那么它可能表明第三李
我想你是我的意思。 對不起的解釋感到抱歉。 幫幫我吧
var $items = $('ul li'), $cat = $('#cat'), $lang = $('#lang');
$('#cat, #lang').change(function(){
var cat = $cat.val(), lang = $lang.val(), $filtered = $items;
if(cat){
$filtered = $filtered.filter('.' + cat);
}
if(lang){
$filtered = $filtered.filter('.' + lang);
}
$items.not($filtered).hide();
$filtered.show()
})
演示: 小提琴
似乎而不是排序你想根據貓和郎的選擇顯示/隱藏項目。 以下功能將滿足您的目的:
$("#movieFeatureFilter span#selGenre .subMenus li").click(function () {
/*GET cat AND lang FROM DROPDOWNS*/
var cat = $("#c").val(),
lng = $("#l").val();
$("#<ID OF UL> li").filter(function () {
$this = $(this);
if ($this.hasClass(cat)) {
if (!$this.hasClass(lng)) {
$this.hide();
} else {
$this.show();
}
} else {
$this.hide();
}
});
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.