Question

我希望每次点击子图库都不会重新加载页面。

所以我决定将内容加载到页面的包装div中。

内容有效并且在第一次点击时无需刷新即可更改，但第二次点击会重新加载等等...

我猜这个剧本不知道新内容？

我在点击事件中使用了Jquery的.bind，点击事件总是在没有页面刷新的情况下触发。我通过注释掉.load行并使用警报（“wonga！”）测试了这个。

这是.load导致第二次点击时页面刷新，但不确定原因。

如果有人对此有任何建议或意见，我将非常感激。

$('#gallery_subgalleries a').bind('click', function() {
      $('.content_loader').load("index.cfm?subgallery_id=" + $(this).attr('rel') + "&gallery_id=" + $(this).attr('gallery_id') + " " + ".content_loader");
return false;
});

脚本在页面底部执行：

 <div class="content_loader">
     <!--- page content --->
     <div id="gallery_subgalleries">
          <a href=""  gallery_id="" rel="">sub gallery name</a>
     </div>
     <!--- page content --->
 </div>

 <script>is here</script>

我目前无法显示网页来源..

感谢您的帮助。

Answer 1

当您引入新内容时，其中包含的新链接元素将不会触发load()来电。原因是当您执行原始bind()时，新的链接元素不存在。

有两种解决方法。

您可以在每次加载时重新绑定新链接，即重新运行上面的代码段。

另一种更好的方法是使用event delegation，它使用另一个元素来监听点击，而不需要任何重新绑定。它也非常整洁，您只需要对代码进行一次更改：

$('#gallery_subgalleries a').live('click', function() {
    $('.content_loader').load("index.cfm?subgallery_id=" + $(this).attr('rel') + "&gallery_id=" + $(this).attr('gallery_id') + " " + ".content_loader");
    return false;
});

请注意从bind到live的更改。

JQUERY :(选择器）.load（url id），每秒加载一次

1 个答案: