jQuery 加载问题答案

【问题标题】：jQuery load questionjQuery 加载问题
【发布时间】：2009-10-05 20:39:06
【问题描述】：

我正在使用 jquery 加载功能在我的页面中的日历页面之间滚动。我正在使用这个功能

$(document).ready(function(){
    $('a.cal').bind('click', function(e) {           
        var url = $(this).attr('href');
        $('div#calender').load(url); 
        e.preventDefault(); 
    });
});

将行为分配给具有“cal”类的锚点，该锚点基本上将日历的下一页和上一页加载到日历的容器#calender中。

问题是该行为只有效一次。 div 第一次很好地刷新了新内容，但随后单击下一个/上一个按钮会加载一个新页面。

谁能帮帮我？

我的猜测是上面的代码在第一次加载时将行为分配给具有类 'cal' 的锚点，但是单击下一个/上一个按钮会刷新 div 中的日历，并且那些导航按钮没有 ajax行为。

我该如何解决这个问题...非常感谢您的帮助。

谢谢。

【问题讨论】：

标签： jquery ajax load

【解决方案1】：

使用live 确保处理程序绑定到所有当前和未来元素：

  $('a.cal').live('click', function(e) {           
      var url = $(this).attr('href');
      $('div#calender').load(url); 
      e.preventDefault(); 
  });

【讨论】：

【解决方案2】：

您可以尝试使用live("click"... 而不是bind("click"...

live() 使用事件委托，而bind() 直接附加到元素，因此当您创建在附加事件处理程序时不存在的新元素时，它们不会获得事件处理程序。

【讨论】：

【解决方案3】：

而不是绑定使用live

$('a.cal').live( 'click', function(e) {
   // your same click handling
});

来自文档http://docs.jquery.com/Events/live#typefn

将处理程序绑定到所有当前和未来匹配元素的事件（如点击）

这基本上意味着每当使用 cal 类添加新元素时，它们都会自动将您的事件处理程序绑定到它们

【讨论】：