Question

我正在使用jquery来分页HTML表。

我有2个CSS类， aPage 和 thePage ，一个创建分页字符串的javascript函数，和jquery代码将每个“页面”绑定到单击事件，以便在单击页面时计算分页字符串。

我的问题是点击事件只会触发一次，但我想在每次点击一个页面时触发它。

非常感谢任何帮助。谢谢！ 的

我的javascript / jquery代码是：

var thisPage=1; npages=10;
 //initial pagination
  $("#pag").html(showPag(thisPage,npages));

 //  bind pagination string to click event
     $(".aPage").click(function(event){
           var thisPage=$(this).text()
     $("#pag").html(showPag(thisPage,npages));
     });
 // function that returns pagination string
     function showPag(thisPage,npages) {
     p="";
     for(i=1;i<=10;i++){
     if(i==thisPage) {
     p+="<span class='thePage'>"+i+"</span>"
      }
     else {p+="<span class='aPage'>"+i+"</span>" }
     }
     return p;
   }

Answer 1

使用live绑定click事件

 $(".aPage").live('click',function(event){
           var thisPage=$(this).text()
     $("#pag").html(showPag(thisPage,npages));
     });

Answer 2

由于您每次拨打.aPage时都在销毁旧的.html()链接，因此您需要使用.live()或.delegate()

使用.live()

$(".aPage").live("click", function(event){
   var thisPage=$(this).text()
   $("#pag").html(showPag(thisPage,npages));
});

使用.delegate()

$("#pag").delegate(".aPage", "click", function(event){
   var thisPage=$(this).text()
   $("#pag").html(showPag(thisPage,npages));
});

Answer 3

您需要将click事件重新绑定到重新封装页面的跨度，或者您可以使用jQuery的委托或实时函数。发生的事情是，绑定click事件的方式仅涵盖具有类aPage的现有跨度。现场或代表将绑定现有和未来：

$(".aPage").live("click", function(event){
           var thisPage=$(this).text()
     $("#pag").html(showPag(thisPage,npages));
     });

Answer 4

您的点击事件已注册到班级的元素.aPage而不是#pag元素。如果带有.aPage类的元素恰好位于你的#pag元素中（你没有指定，所以我只是在这里猜测），当你替换页面的html时会被销毁。要修复此问题，请将点击处理程序绑定到#pag。

您还可以尝试以下操作：

变化

$(".aPage").click(function(){...})

到

$(".aPage").live('click',function(){...})

这将使用该className绑定到所有present和FUTURE元素。

Answer 5

从jQuery 1.7开始，不再支持live，而建议使用delegate。

$("#pag").delegate(".aPage", "click", function(event){
    var thisPage=$(this).text()
    $("#pag").html(showPag(thisPage,npages));  
});

绑定到click事件 - 事件只触发一次

5 个答案: