0

このコードのスニペットを使用して (それを調整する必要がありました)、スクロール時に自分のページの新しい投稿を自動読み込み (Twitter と考えてください) しました。

ユーザーが高速でスクロールするとサーバーのリソースが重いため、ボタンをクリックするとアクティブになるようにします。<button id="load_more">Load more</button>

私の変換を手伝ってくれる人はいますか？私はそれを動作させることができません...（さらに、最終的にビジーインジケータを削除します）

autoscroll に使用するコードは次のとおりです。

<?php
 $maxPage = $this->Paginator->counter('%pages%');
 ?>
 <script type="text/javascript">
 var lastX = 0;
 var currentX = 0;
 var page = 1;

 $(window).scroll(function () {
 if (page < <?php echo $maxPage;?>) {
  currentX = $(window).scrollTop();
 if (currentX - lastX > 150 * page) {
  lastX = currentX - 150;
  page++;
  $("#busy-indicator").fadeIn();
  $.get('<?php echo $this->Html->url('/users/getmore_timeline/'.$this->Session->read('Auth.User.id')); ?>/page:' + page, function(data) {
  setTimeout(function(){
  $('#postList').append(data);
  var bi =  $("#busy-indicator");
       bi.stop(true, true);
       bi.fadeOut();
  }, 500);
 });
 }
 }
 });
 </script>

編集 ：

やってみた（記憶より）

<button onlick"LoadMore()">Load More</button>

<?php  
 $maxPage = $this->Paginator->counter('%pages%');  
 ?>  
 <script type="text/javascript">  

function LoadMore () {  
 if (page < <?php echo $maxPage;?>) {  
  page++;  
  $("#busy-indicator").fadeIn();  
  $.get('<?php echo $this->Html-  >url('/users/getmore_timeline/'.$this->Session->read('Auth.User.id')); ?>/page:' + page, function(data) {
  setTimeout(function(){  
  $('#postList').append(data);  
  var bi =  $("#busy-indicator");  
       bi.stop(true, true);  
       bi.fadeOut();
  }, 500);
 });
 }
 };
 </script>
4

1 に答える 1

0

ここで何かを見逃したかどうかはわかりませんが、関数を呼び出すボタンだけが必要な場合LoadMore():

HTML

<button id="load_more">Load more</button>

JS

$('#load_more').on('click', function() {
    Loadmore()
})

PS: あなた<button onlick"LoadMore()">Load More</button>の については、タイプミス (非常に面白いもの:D) があり、等号を忘れており、インライン イベント ハンドラーの使用を避ける必要があります。

于 2012-10-22T00:44:34.210 に答える