動的なjQuery/JSONメニューは、ログアウトまで静的にされました。

Question

< li>のニュース記事のリストはjQuery（.ajax）とJSONを使用して動的に作成されています。 JSONデータを受け取ったら、リスト項目を作成し、親に< ul>を追加しました。

私の問題は、ユーザーが戻るボタンを使用してニュース領域を再入力すると、リストが取得されて再び追加され、重複するリスト項目が表示されることです。 jQueryで.ajaxリクエストを1つの負荷に制限する方法はありますか？または、すべてのニュースをセッション/ローカルストレージに< li>を追加する必要がありますか？

コード：

$('#schoolnews').live("click", function(){ 
$.mobile.showPageLoadingMsg(); 
var schoolID = sessionStorage.getItem('schoolID'); 
var entityType = sessionStorage.getItem('entityType'); 
$.ajax({ 
    url: 'http://www.sycamoreeducation.com/mobile/JSON/getnewslist.php', 
    data: {schoolID: 'schoolID', entityType: 'entityType'}, 
    dataType: 'jsonp', 
    jsonp: 'jsoncallback', 
    timeout: 5000, 
    success: function(data){ 
    //alert("Success in retreiving JSON News Data!"); 
    $.mobile.changePage('#news'); 
    $.each(data, function(index, value){ 
       var newslistitems = '<li class="newsitem" data-theme="c"><h3>' +value.Subject+ '</h3><p>Posted on: ' +value.Day+ '</p></li>'; 
      $('ul#newslist').append(newslistitems); 
     }); 
    $('ul#newslist').listview('refresh'); 
    $.mobile.hidePageLoadingMsg(); 
    }, 
    error: function(){ 
    alert('Error Message'); 
    } 
}); //end login ajax call 
}); //end school news click listener 

まだ非常に多くの初心者、それはjQueryのに来るときあなたは、私が改善することができます任意の領域を見つけることができますので、もし、私が知っているように躊躇しないでください。ありがとう！

Answer 1

また、あなたが（HTMLを使用することができます）

newslistitems += 

へ

の$ .each変更以内

var newslistitems .... 

そして、ループの前に、ループ追加した後newslistiemsを定義します。

$('ul#newslist').html(newslistitems); 

このようにして、各項目はnewslistitems変数に追加され、ループの最後にul＃ニュースリストに追加され、html（）はul＃ニュースリスト内の以前の内容をすべて消去してnewslistitems変数の内容に置き換えます。