0

我正在尝试使用 jQuery .load 方法加载我的所有网站页面,这就是我的网站的外观:

<script type="text/javascript">  
  $(function() {
    $('.link').bind('click', function(e) {
            var page = $(this).attr('href');
            $('#site').addClass('loading');
            $('#content').load(page, function (){
            $('#site').removeClass('loading');
    });

    e.preventDefault();
    return false;
  });

<a href="test.php" class="link">Test</a>

使用此代码,每个获得 class="link" 的链接都会在 div #content 上加载我的页面。工作正常!没有问题,但是当我加载 test.php 时,如果我在任何链接、按钮或其他任何东西上使用 class="link",它就不起作用,并且新页面加载到我的 #content 之外。

已经尝试将其复制到新加载的文件中,但它不起作用,有人有提示吗?

谢谢

4

1 回答 1

2

这是因为当你绑定一个事件时,它只会将它绑定到当时 DOM 中的元素。因此,如果您稍后添加新的,它们将不会绑定到您之前附加的事件。假设你有 jQuery 1.3,它有一个内置的函数来解决这个叫做live. 有了它,您可以将事件绑定到所有当前和未来的元素。它不支持所有事件,但click确实支持。

所以记住这一点,你只需要替换这个:

$('.link').bind('click', function(e) {

有了这个:

$('a.link').live('click', function(e) {

(我将 a. 添加到选择器中,因为如果可能的话,指定标签会更有效)

如果你没有 jQuery 1.3,你应该尽快升级。如果你不能,请查看livequery插件,它可以实现相同的功能,但以一种不太优雅的方式。或者,您可以简单地使用一个函数来绑定操作并在每次加载新数据时调用它。考虑到所有因素,jQuerylive是执行此操作的最佳方法。

于 2009-08-04T06:01:00.870 回答