jquery設置onclick null並更改ajax成功的按鈕圖像

Question

我有一個上傳照片的ajax函數，並執行此功能onclick。 我想要的是刪除成功上的onclick事件，並在uploadPhoto中更改按鈕樣式。如何才能做到這一點？

function uploadPhoto(image_path, message){ 
     var data = { 
      "image_path": image_path, 
      "message": message 
     }; 
     var url = 'upload_photo.php'; 
     $.ajax({ 
      type: 'POST', 
      url: url, 
      data: data, 
      async: true, 
      dataType: 'json', 
      success: function(response) { 
        //alert(response.code); 
        } 
       }); 
    } 



     <a href="#" onclick="uploadPhoto('/images/blah.jpg', 'something'); return false;"><img style = "padding-top: 15px; padding-left: 125px;" src= "images/posteaza_pe_wall.png"></a> 

Answer 1

你真的應該使用JQuery點擊事件，但是，這應該做你想做的。爲您的a href指定一個ID，然後刪除ajax成功的onclick屬性。

您需要通過「更改按鈕樣式」來定義您的意思，因爲您的鏈接當前是圖片。作爲一個例子，我已經添加了一個例子，在稱爲「uploadStyle」的成功後，向href添加一個新類。你需要在CSS中定義這個。

function uploadPhoto(image_path, message){ 
     var data = { 
     "image_path": image_path, 
     "message": message 
    }; 
    var url = 'upload_photo.php'; 
    $.ajax({ 
     type: 'POST', 
     url: url, 
     data: data, 
     async: true, 
     dataType: 'json', 
     success: function(response) { 
       $("#uploadHref").removeAttr("onclick"); 
       $("#uploadHref").addClass("uploadStyle"); 
       //alert(response.code); 
       } 
      }); 
} 

<a id="uploadHref" href="#" onclick="uploadPhoto('/images/blah.jpg', 'something'); return false;"><img style = "padding-top: 15px; padding-left: 125px;" src= "images/posteaza_pe_wall.png"></a> 

Answer 2

我同意瑞克伯恩斯的答案。它會更清潔一些，因爲你使用JQuery來做類似

$("#uploadHref").one("click",function() { 
    // stuff that happens on click 
});