检查网址并根据检测到的ID值过滤内容

时间:2015-07-03 03:51:44

标签: jquery

这里的逻辑:如果网址有!#10或!#20或!#30,请检查li的id值。然后根据li id值过滤div“contentEle”。 “contentEle”id& li id匹配,过滤。

我的脚本:过滤器正在运行。但添加选择的课程不起作用。它选择容器中的最后一个元素并过滤该id并显示。

HTML

http://localhost:1234/test/index.html#!id10

<ul>
    <li class="slist selected" id="id1"><a href="#!id10">Test1/a></li>
    <li class="slist" id="id2"><a href="#!id20">Test2</a></li>
    <li class="slist" id="id3"><a href="#!id30">Test3/a></li>
</ul>


<div class="content specials">
    <div class="contentEle id1">
            <img src="http://lorempixel.com/265/149/sports/" alt="">
            <div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ve...</div>       
    </div>
    <div class="contentEle id2">
            <img src="http://lorempixel.com/265/149/sports/" alt="">
            <div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ve...</div>       
    </div>
    <div class="contentEle id1">
            <img src="http://lorempixel.com/265/149/sports/" alt="">
            <div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ve...</div>       
    </div>
    <div class="contentEle id2">
            <img src="http://lorempixel.com/265/149/sports/" alt="">
            <div class="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ve...</div>       
    </div>
</div>

JS

var $els = $('.content div.contentEle').hide(),
    $curr = $();

$('ul li').each(function(i)
{
    var listID = "#!" + window.location.href.split("!")[1];
    if ($('ul li a[href="' + listID + '"]').length) {   
        console.log(listID); 
        $('.slist.selected').not(this).removeClass('selected');
        $(this).addClass('selected');
        $curr = $els.filter('.' + this.id).hide();
        $curr.slice(0, 6).show();
        $els.not($curr).hide();  
    } 
});

1 个答案:

答案 0 :(得分:0)

你可以尝试

select t1.name, t2.name
from table1 as t1
inner join table1 as t2
ON t1.name like '%'+t2.name+'%'
AND t1.name <> t2.name 
var $els = $('.content div.contentEle').hide(),
  hash = '!id10' //could be window.location.hash.replace(/^#/, '')
;

if (hash) {
  var $a = $('.slist a[href="#' + hash + '"]'),
    $li;
  if ($a.length) {
    $li = $a.parent().addClass('selected');
    $li.siblings('.selected').removeClass('selected');
    $els.filter('.' + $li.attr('id')).show()
  }
}