頁面顯示重複的帖子，我每次點擊按鈕

Question

我有一個奇怪的問題與JQuery的移動。我創建了一個顯示帖子並正確顯示帖子的頁面。

現在的問題是，每當我點擊後退按鈕並再次點擊帖子按鈕時，它會複製帖子並顯示。我點擊後退按鈕並點擊發布按鈕的次數，帖子相應地被複制並以倍數顯示。

例如，我有一個正在顯示的帖子。現在我點擊返回按鈕，然後點擊顯示帖子按鈕，這次，同一帖子顯示兩次。現在再次，如果我點擊返回按鈕，然後點擊顯示帖子按鈕，它現在相同的帖子顯示三次等等。

但是，如果我在每次後退按鈕點擊後刷新頁面，則它會正確顯示帖子。任何人都可以引導我在哪裏出錯？

這裏是代碼：

HTML頁面：

<div data-role="page" id="userpost"> 
    <div data-role="header" data-theme="b"> 
     <a class="back" class="button button-clear" data-rel="back" data-icon="back" href="#">back</a> 
     <p style="text-align: center">Posts History</p> 
    </div> 
    <div data-role="content"> 
     <p id="username"></p> 
     <div class="row cf" id="userPosts"> 
     </div> 

     <div data-role="footer" data-position="fixed" data-theme="b"> 
      <h6>&copy;</h6> 
     </div> 
    </div> 
</div> 

jQuery代碼：

function displayuserPosts() { 
    if (localStorage.login = "true") { 
     var username = localStorage.username; 
     $('#username').append("<p style='font-size:10px; color:red; text-align:center;'>Welcome: " + username + "</p>"); 
     var userPosts = "username=" + username + "&upost"; 
     $.ajax({ 
      type: "GET", 
      url: "../php-code2/uposts.php", 
      data: userPosts, 
      dataType: "json", 
      success: function (data) { 
       $.each(data, function (i, field) { 
        $("#userPosts").append('<p class="job cf">'+ field.title +'</p>'); 
       }); 
      } 
     }); 
    } else { 
     alert("Please login to post a Job"); 
     window.location.href = "#Main"; 
    } 
} 

Answer 1

在此行中：

$("#userPosts").append('<p class="job cf">'+ field.title +'</p>'); 

變化.append到.html。

「追加」意味着添加內容到元素中已有的內容（在這種情況下爲#userPosts）。
）

---

EDIT

好。那我們試試其他的東西吧。
您已經在使用本地存儲...

爲什麼在加載帖子時不設置布爾標誌？
和一個日期標誌知道它何時被加載...

我稱之爲一個標誌是一個變量，只用於記住一個狀態...用於比較。

所以這應該工作。
請注意，您可以使用more precise time來記住。

// It good to know todays date. 
var today = new Date().getDate(); // day of the month 

function displayuserPosts() { 

    // Executes only if logged in AND the posts not already loaded today. 
    if( localStorage.login == "true" 
     && localStorage.userpostsLoaded != "true" 
     && localStorage.userpostsWhen != today){ 

     var username = localStorage.username; 
     $('#username').append("<p style='font-size:10px; color:red; text-align:center;'>Welcome: " + username + "</p>"); 
     var userPosts = "username=" + username + "&upost"; 

     $.ajax({ 
      type: "GET", 
      url: "../php-code2/uposts.php", 
      data: userPosts, 
      dataType: "json", 
      success: function (data) { 
       $.each(data, function (i, field) { 
        $("#userPosts").append('<p class="job cf">'+ field.title +'</p>'); 
       }); 

       // Set some flags! 
       localStorage.userpostsLoaded="true"; 
       localStorage.userpostsWhen=today; 
      } 
     }); 

    }else{ 

    // If the Ajax request was avoided because of the login 
    if(localStorage.login != "true"){ 
     alert("Please login to post a Job"); 
     window.location.href = "#Main"; 
    } 
    } 
}