需要添加功能

我想添加一個簡單的功能到我的頁面，在那裏用戶將看到一個「關注」按鈕，並通過點擊它將創建一個數據庫記錄（userID和pageID）。我想在後端處理查詢。我認爲我需要在AJAX中做到這一點，但我在AJAX方面做得並不多。我也在想，將按鈕狀態從FOLLOW更新爲FOLLOWING（或類似的），我可以用jQuery做些什麼，並且在請求正在後臺處理時進行某種切換。需要添加功能

我在正確的軌道上嗎？

來源

2010-12-13 santa

這聽起來不錯。我唯一需要改進的是，在你從AJAX請求得到數據庫正確更新的確認之前，你不應該將「FOLLOW」改爲「FOLLOWING」。您可以在處理過程中顯示一個微調器。除此之外，這聽起來很簡單。你是否需要任何幫助來實施它，或者這只是一個「我在正確的軌道上」的問題嗎？ – AgentConundrum 2010-12-13 00:16:57

您正處在正確的軌道上。

我創建了一個使用像<input type="image" class="follow">這樣的按鈕的示例。當我用戶點擊它時，它會向服務器發送一個請求（url）。成功後，它會更新按鈕圖像。

$('input[type=image].follow').click(function() { 
    var button = $(this); 
    var current_img = $(button).attr('src'); 
    var current_alt = $(button).attr('alt'); 

    $(button).attr('src', '/style/icons/ajax-loader.gif'); 
    $(button).attr('alt', 'Requesting data from the server...'); 

    $.ajax({ 
     url: url of script the processes stuff (like db update), 
     type: 'POST', 
     data: {}, 
     dataType: "json", 
     error: function(req, resulttype, exc) 
     { 
     $(button).attr('src', '/style/error.png'); 
     $(button).attr('alt', 'Error while updating!'); 
     window.setTimeout(function() { 
      $(button).attr('src', current_img); 
      $(button).attr('alt', current_alt); 
     }, 3000); 
     }, 
     success: function(data) 
     { 
     $(button).attr('src', '/style/followed.png'); 
     $(button).attr('alt', 'Followed'); 
     } 
    }); 

    return false; 
    });

以上只是一些示例代碼。根據您的意願改變它。玩得開心。

來源

2010-12-13 00:19:52 PeeHaa

很酷，謝謝你的例子。如何將一些變量傳遞給將處理請求的php頁面？這是在URL：mypage.php？var1 = a＆var2 = b或在數據：{}？謝謝。 – santa 2010-12-13 13:57:34

我發現將數據添加到數據中'更乾淨'，因爲它們將使用POST而不是GET。但是，這可能只是我:) – PeeHaa 2010-12-13 16:27:52

我使用一個編碼URL的類，所以我的變量可以安全地通過URL，但我明白了你的觀點，並可能在這種情況下使用POST。我仍然需要弄清楚如何傳遞數據。我只是建立一個測試頁面並對此進行實驗。再次感謝一個很好的例子。 – santa 2010-12-31 21:05:38

AJAX是正確的，jQuery使ajax容易。

//Post with jQuery (call test.php): 
$.post('test.php', function(data) { 
    //Do something with result data 
});

來源

2010-12-13 00:17:32 Ilyssis

這聽起來像你在這裏正確的軌道。如果您正在處理較小的應用程序，那麼使用AJAX請求並創建記錄最容易，可以使用Java servlet並在doGet或doPost方法中放置一些JDBC代碼來執行數據庫操作。同時，您的AJAX請求的onSuccess方法可以調用更新按鈕所需的jQuery代碼。祝你好運！

來源

2010-12-13 00:18:00 Raskolnikov

需要添加功能

回答

相關問題