Jquery:只在第一次点击“加载更多......”时才加载下一页

时间:2012-05-25 06:22:59

标签: jquery ajax

如果是DIV,我需要在每次单击文本“加载更多”时加载内容。我目前的代码如下:

<div id="Container"> <p class="load">load more</P> </div>

$(".load:last").click(function(){
$(".load:last").load("nextPage.php", function() {
$(this).hide();

$("div#Container").append($(this).html());
$("div#Container").append("<p class=\"load\">load more...</p>");

});

第一次点击有效,因为它从nextPage.php加载更多内容。但是,随后的点击不会触发负载。我做错了什么?

3 个答案:

答案 0 :(得分:0)

    $(".load:last").live('click', function () {
        $(this).remove();
        //Or
        // $(this).hide();
        $(".load:last").load("nextPage.php", function () {
            $("div#Container").append($(this).html());
            $("div#Container").append("<p class=\"load\">load more...</p>");
        });
    });

答案 1 :(得分:0)

由于.load每次都附加到div#Container作为新内容,您应该对.load使用实时事件处理程序,如下所示:

$("div#Container").on('click', '.load', function() {
  $(this).parent('div#Container').load('nextPage.php', function() {
     $('div#Container').append("<p class=\"load\">load more...</p>");
  })
})

答案 2 :(得分:0)

尝试使用jquery 的 .live()方法或.on(),这会为现在和将来与当前选择器匹配的所有元素附加一个事件处理程序。

Click here for information and example for .live event in jquery
我希望这肯定会解决你的问题。

祝你好运! :)