jquery - 在同一页面中加载链接 jQuery

Question

此代码用于可过滤的投资组合。最初我使用 PHP 来处理下一个和上一个链接，但是当过滤组合时，它找不到下一个过滤对象。我发现过滤器将列表项放在 DOM 中彼此相邻的位置，因此我使用 next() 来获取结果。但是，该链接无法正确加载。它是加载thickbox 的同一页面上的链接。我已经成功地让它在新窗口中打开并附加到窗口 url，但没有骰子试图让它工作。这是该投资组合的地址。

http://blurosemedia.com/portfolio

$(document).ready(function(){
    $(".portfolio-next").click(function(e) {
    var $this = $(this);
    if($this.data('clicked', true)) {
    var namer = $(this).attr('value');
    var url = $(this).parents('body').children('#wrap').children('#inner').children('#content-sidebar-wrap').children('#content').children('ul#portfolio-list').children().next('.portfolio-item-' + namer).nextAll('.portfolio-item:not(:.isotope-hidden)').attr('id');
        window.location.load(url);
        e.preventDefault();
   }
        });
});

我必须一路爬上道琼斯指数树，因为厚盒代码会自动显示在页面底部。我认为一种可能的解决方案是为了加载thickbox，你必须有class =“thickbox”。如果我能以某种方式说 load(url).withClass('thickbox') 它可能会工作，但我确定语法应该如何。

Answer 1

您有很多事情需要解决，但这里有一些信息可以帮助您走上正确的道路:

1)

window.location.load不退出，您要查找的是window.location.href:

请参阅文档 from MDN

请参阅文档 from MSDN

例如， window.location.href = url;

<小时/>

2)

此外，

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

您正在使用以 # 开头的 ID 设置 li。

参见this link获取更多信息!

解决方法:

<li id="#TB_inline?height=450&width=900&inlineId=id-3" class="portfolio-item design portfolio-item-3 isotope-item">...</li>

可以是:

<li class="portfolio-item design portfolio-item-3 isotope-item">
 <span style="display:none;">#TB_inline?height=450&width=900&inlineId=id-3</span>
</li>

<小时/>

3)

您无缘无故地在 DOM 中上下移动。由于您的商品包装上有一个 ID (#portfolio-list)，因此您可以定位它并从那里开始!

另外，

('.portfolio-item:not(:.isotope-hidden)')

应该是:

('.portfolio-item:not(.isotope-hidden)')

使用 :not(:something)，用于定位具有某种状态的元素，例如 :checked

参见this Link欲了解更多信息!

<小时/>

4)

由于变量 namer 获取打开项目的当前 id，并且您想要传递到下一个项目，您的代码将变为:

$(document).ready(function(){
  $(".portfolio-next").click(function(e) {
    e.preventDefault();

    var $this = $(this);

    var namer = parseInt($this.attr('value'))+1;
    var url   = $this.attr("href");
        url   = url.substring(0, url.indexOf('=id'));
     
   window.location.href(url+"=id"+namer);
  });
});

查看此Fiddle Example !

请注意，标签a没有任何属性value，因此它是无效标记。

参见this link欲了解更多信息。