Question

Hei ..我有一个加载更多新闻的功能。由于jquery-1.9.1.min.js这个函数工作正常，但现在我必须用.on（）方法替换它，我仍然无法使它工作。

以下是代码：

  // Load more news feed
  $(function(){
      var page = 1;
      $.ajax({
          type: "POST",
          url: "data.php",
          data: "page=profile&get_news_feed=true",
          dataType:'json',
          success: function(data){
              $("#the_news_feed").html(data.news_feed);
              if(page <= data.total_pages){
                  $("#the_news_feed").after('<button id="load_more_feed" class="btn btn-primary btn-large" style="width: 100%;margin-top:10px">Load More</button>');
              }
          }
      });
      $("#load_more_feed").live("click", function(){
          var next = page+=1;
          $.ajax({
              type: "POST",
              url: "data.php",
              data: "page=profile&get_news_feed=true&page_num="+next,
              dataType: "json",
              success: function(data){
                  $("#the_news_feed").append(data.news_feed);
                  if(next == data.total_pages){
                      $("#load_more_feed").remove();
                  } else {
                      $("#load_more_feed").html("Load More");
                  }
              },
              beforeSend: function(){
                  $("#load_more_feed").html("Loading...");
              }
          });
      });
  });

我试图替换：

$("#load_more_feed").live("click", function()

带

$("#the_news_feed").on("click", "load_more_feed", function()

但我仍然无法让它发挥作用。我究竟做错了什么？谢谢！

我用id =“news_feed”显示这个函数，所以这就是问题

<div class="tab-pane fade" id="news_feed">
  <div id="the_news_feed"></div>
</div>

最终解决方案是$("#news_feed").on("click", "load_more_feed", function()

谢谢你们！

Answer 1

实际上，你错过了id选择器中的#。

$("#the_news_feed").on("click", "load_more_feed", function()

必须是

$("#the_news_feed").on("click", "#load_more_feed", function()

假设#the_news_feed是#load_more_feed的父级。

编辑：

在您的代码中，您在 #loadmore之后附加了此#the_news_feed按钮，因此这显然不起作用。尝试将其更改为：

$(document).on("click", "#load_more_feed", function()

这会将点击绑定到始终存在的document。或者，您可以将它绑定到#load_more_feed最接近的静态父级，就像加载页面时存在但不动态创建的元素一样。

如何用.on（）方法替换.live（）方法

1 个答案: