ajax分页后,Click事件不起作用

Question

我真的希望有人可以帮助解决这个问题.我有一个ajax分页脚本,在第一页上运行良好,但点击事件不适用于分页中的任何其他页面.

这就是我设置它的方式:

jQuery脚本

<script type="text/javascript">
// prepare when the DOM is ready 
$().ready(function() {
//popup div
$(".wsbutton_pop").click(function(e){ 
//getting height and width of the message box

      var height = $('#popuup_div').height();
      var width = $('#popuup_div').width();
      //calculating offset for displaying popup message
      leftVal=e.pageX-(width/2)+"px";
      topVal=e.pageY-(height/2)+"px";
      //show the popup message and hide with fading effect
      $('#popuup_div').css({left:leftVal,top:topVal}).show();
      $('#popuup_div').html("<img src='images/ajaximg.gif' border='0'>");

       $.ajax({ 
          type: "get", 
          url: $(this).attr("href"), 
          success: function(r){ 
           $('#popuup_div').html("")   
           $('#popuup_div').prepend(r);
             }
     });

  });

//close div on mouse click

$(".popup_msg").click(function(e){ 
      $('#popuup_div').fadeOut();
  }); 

}); 
</script>

这应该弹出一个包含来自另一个页面的内容的div.

现在我的链接: <a href="http://mysite.com/file.php?content=1" class="wsbutton_pop">Load content</a>

这在初始页面上工作得很好但现在问题是当我点击访问具有完全相同链接的第2页时,该链接不再起作用.

作为一个注释,我的页面应加载id ="paging"的div.ajax分页本身很有效,只是结果页面上的任何jquery click事件都不起作用.我认为问题可能是我需要重新绑定脚本但我不知道如何实现它.

感谢您的帮助.

Answer 1

我猜你会用分页覆盖链接,因此click事件不再受限制.如果您使用的是jquery 1.3,则可以使用实时事件来解决此问题.

$(".wsbutton_pop").live("click", function(e) { ...

或者,如果您使用的是早期版本的jQuery,则可以在获取新页面数据时重新附加事件处理程序.