2

在加载页面时，我的getJSON调用将其输出显示到 div（称为 myDiv）。

现在我想在页面末尾添加一个按钮，当用户单击该按钮时，我想再次调用getJSON，但这次我想将 page_number 增加一，每次用户单击按钮时在先前结果的末尾显示新结果。你们能告诉我我该怎么做吗？

<head>
  <script>
    //var counter = 1;
    $.getJSON('http://anyorigin.com/get?url=https://www.myothersite.com/getit.php?page_number=+counter&type=TopVideos&sortBy=newest&callback=?', function(data){
      var siteContents = data.contents;
      //writes to textarea
      document.myform.outputtext.value = siteContents;
      document.getElementById("myDiv").innerHTML=siteContents;
      $('#loadingimg').hide();
    });
  </script>
</head>
<body>
  <div class="MainDiv">
    <div class="MainContent">
      <div class="ContentWidth">
        <div id="JSListVideo" class="VideoList">
          <div id="myDiv"></div>

和按钮代码：

<div class="MoreButtonSection">
  <div class="RedButton">
    <span class="LeftEnd"></span>
    <span class="Centre">
      <a href="javascript:void(0);" onclick="seemore();" title="See more">see more</a>
    </span>
    <span class="RightEnd"></span>
  </div>
</div>
4

3 回答 3

2

首先将代码包装在$(document).ready();.

现在您需要click为按钮创建一个事件，以便在单击该按钮时，它会调用getJson，然后您可以将数据附加到所需的 div，因为现在您的代码只会在加载时运行。

例子

$(document).ready(function() {
  var counter = 1;
  $('button').on('click',function() {
    $.getJSON('http://anyorigin.com/get?url=https://www.myothersite.com/getit.php?page_number=+counter&type=TopVideos&sortBy=newest&callback=?', function(data) {
      var siteContents = data.contents;
      document.myform.outputtext.value = siteContents;
      $("myDiv").html(siteContents);
      $('#loadingimg').hide();
    });
    counter++;
  });
});
于 2013-03-22T03:37:05.510 回答
2

在回答之前，我建议您坚持使用一种方法，jQuery 语法或 Javascript。我想你想要分页代码。下面的代码可能对你有用。

我想在下面为您提供一些关于如何完成的想法。如果我错了，请纠正我。

//initialize page number to 1 default
var pagenumber=1;
$(document).ready(function(){
  //load first page records on page load
  getResult(pagenumber);
});

//pass pagenumber to function to fetch correct page records
function getResult(pagenumber){
  $.getJSON('http://anyorigin.com/get?url=https://www.myothersite.com/getit.php?page_number='+ pagenumber +'+counter&type=TopVideos&sortBy=newest&callback=?', function(data){});
  //after every call increment page number value
  pagenumber++;
}
$('btnLoadMore').click(function(){
  //simply call getResult
  getResult(pagenumber);
});

我无法seemore()在您的代码中找到该函数。也许你想要这样的东西。您的 HTML 必须是：

<a href="#" onclick="return seemore();" title="See more">see more</a>

JS 必须是：

function seemore(){
  counter++;
  return false;
}

counter必须是全局变量才能访问。不知道您的网址：

http://anyorigin.com/get?url=https://www.myothersite.com/getit.php?page_number=+counter&type=TopVideos&sortBy=newest&callback=?

我认为应该是：

http://anyorigin.com/get?url=https://www.myothersite.com/getit.php?page_number='+ counter +'&type=TopVideos&sortBy=newest&callback=?
于 2013-03-22T03:37:53.140 回答
1

您可以将值添加到当前值。看下面：

document.getElementById("myDiv").innerHTML += siteContents;
于 2013-03-22T03:17:26.180 回答