2

このチュートリアルjquery.append()を使用して、 ajax と を使用して無限スクロールを実装しました。ajax が成功すると、jquery は に 10 個の要素を追加します。<li><ul>

スクロールは Chrome と Firefox では正常に動作しますが (もっと高速になる可能性がありますか?)、スクロールすると IE がクラッシュします。IE のクラッシュを回避し、パフォーマンスを改善する方法について何か提案はありますか?

<li>要素にはこれが含まれます：

<div class="post_div" align="left">
 <div class="separator_div"></div>
   <table class="post_table" align="left">
     <tr><!--header e.g title-->
    <td class="td_first1"><!--title-->
        Title
    </td>
    <td class="td_second1"><!--blank-->
    </td>
     </tr>

     <tr><!--middle e.g picture-->
    <td  class="td_first2"><!--picture-->
         <img class="img" id="49130" width="480" height="360" src="pic.jpg"></img>
    </td>
          <td class="td_second2"><!--user,text,vote,share-->
         <div class="user_div"><!--avatar+username-->
             <img class="uavatar" src="avatar.jpg"></img>
             <a href="link/user.php?u=2"><span class="user_span">Jon Doe</span></a>
        </div>
        <div class="text_div"><!--text-->
        some text....
        </div>
       <div class="vote_div"><!--vote-->
        <table align="left" width="220">
                      3coloumsx2rows table here
                    </table>
       </div>
       <div class="share_div"><!--share-->
        2 iframes here          
       </div>
     </td>
    </tr>

    <tr><!--bottom e.g desc-->
    <td class="td_first3"><!--desc-->
    <div class="desc_div">
             onother text here....
    </div>
    </td>
    <td class="td_second3"><!--time+views-->
    0 views  1 second ago
    </td>
    </tr>
    </table>
</div>
4

1 に答える 1

0

JavaScriptコードも表示する必要があります。

覚えておくべきことの 1 つは、スクロールが終了するまで待機する他のブラウザーに対して、スクロール中に IE が「スクロール」イベントを発生させることです。その結果、「scroll」イベントで行っていることはスクロール中に常に実行されるため、10 個の LI を追加すると言うと、実際には数秒で 100 個を追加していることになります。

これに対する解決策は、スクロール時に ajax リクエストを実行するタイムアウトを設定することです。ユーザーがスクロールし続けると、タイムアウトはクリアされてリセットされます。ユーザーがスクロールを停止すると、タイムアウトが完了し、ajax リクエスト関数が呼び出されます。

于 2012-09-17T14:04:39.900 に答える