jQuery Isotope通过URL设置默认排序过滤器

时间:2014-02-01 20:50:09

标签: javascript jquery jquery-isotope

我想知道这个小提琴的问题是什么:http://jsfiddle.net/GwBa8/150/

我想更改默认情况下使用不同的链接加载哪个类别,而无需向我的网站添加额外的页面。最后一个工作状态是这个小提琴http://jsfiddle.net/GwBa8/128/。唯一的区别是以下代码添加到jQuery的开头。

 //e.g. website.com/index/filter/games
  var $criteria = '*';
  var str = window.location.pathname;

  //games
  if (str.substring(str.lastIndexOf('#'))) {
     var $criteria='.'+str.substring(str.lastIndexOf('#'));
} else {
    var $criteria = '*';
}

为什么这段代码会阻止它运行?

我希望像www.website/index#games这样的东西默认加载游戏。

谢谢!

2 个答案:

答案 0 :(得分:1)

你可以做一些像(未经测试的!)

$(window).load(function(){

  //e.g. website.com/index/filter/games
  var str = window.location.pathname;

  //games
  var criteria=str.substring(str.lastIndexOf('/'));

  var $container = $('.creations-container');
  $container.isotope({
      filter: '.' + 'criteria',
  }

});

答案 1 :(得分:0)

基于@nchaud评论......

$(window).load(function(){

 //e.g. website.com/index/filter#games
  var str = document.URL;

     //games
  if ((str.lastIndexOf('#'))!== -1) {
     var $criteria=str.substring(str.lastIndexOf('#'));


} else {
    var $criteria = '#all';

}

这会将变量$ criteria设置为导航中类别的链接的匹配ID。

var $container = $('.creations-container');
$container.isotope({
    filter: '*',
    animationOptions: {
        duration: 750,
        easing: 'linear',
        queue: false
    }
});

$('.creations-filter a').click(function(){
    $('.creations-filter .current').removeClass('current');
    $(this).addClass('current');

    var selector = $(this).attr('data-filter');
    $container.isotope({
        filter: selector,
        animationOptions: {
            duration: 750,
            easing: 'linear',
            queue: false
        }
     });
     return false;
    }); 
$($criteria).trigger("click");

点击地址为的元素