爲什麼$（this）.css在ajax成功中不起作用？

我不知道在阿賈克斯成功，如果$（本）選擇工作或沒有，這裏是代碼：

$(".up_button").click(function(){ 
    var idup_post=$(this).attr("data-idupactive"); 
    var userup_post=$(this).attr("data-userupactive"); 

    $.ajax({ 
     url:"ajax/up_actv.php", 
     data:{"idup":idup_post,"userup":userup_post}, 
     type:"POST", 
     success:function(data){ 

      if(data=="upactv"){ 
       alert(data); //just to check if ajax response is correct 
     $(this).css({ 
      "background-image":"url('icons/u.png')" 
     }); 
     } 
     if(data=="updisv"){ 
      alert(data); //just to check if ajax response is correct 
    $(this).css({ 
      "background-image":"url('icons/uf.png')" 
     }); 
     } 


     } 

    }); 

});

我需要更改選定按鈕的背景，因此，任何幫助將受到歡迎

來源

2017-01-06 Anas Houari

這裏指向全局窗口對象 – Geeky

好吧，不，它實際上指向了別的東西，但是你是正確的，因爲它不是OP期望的。 –

你有沒有想過添加一個類，而不是調用對象上的圖像？ –

這裏指的是XHR（ajax請求）對象。

你可以改變參考或者使用呼叫/應用或引用複製到一個變量，並使用該

檢查這個片段

$(".up_button").click(function() { 
    var self = this; 
    var idup_post = $(this).attr("data-idupactive"); 
    var userup_post = $(this).attr("data-userupactive"); 

    $.ajax({ 
    url: "ajax/up_actv.php", 
    data: { 
     "idup": idup_post, 
     "userup": userup_post 
    }, 
    type: "POST", 
    success: function(data) { 

     if (data == "upactv") { 
     alert(data); //just to check if ajax response is correct 
     $(self).css({ 
      "background-image": "url('icons/u.png')" 
     }); 
     } 
     if (data == "updisv") { 
     alert(data); //just to check if ajax response is correct 
     $(self).css({ 
      "background-image": "url('icons/uf.png')" 
     }); 
     } 


    } 

    }); 

});

希望它可以幫助

來源

2017-01-06 20:15:37 Geeky

對不起，這使chage – Geeky

你真了不起，非常感謝你（y）。我現在明白問題 –

問題是你正試圖設置CSS這個對象...這是指的窗口/全局對象。所以只是複製這個引用到一個變量之外的請求和訪問變量在成功函數中，並嘗試將CSS應用於它 – Geeky

因爲this在success(..)功能指向一個不同的東西，然後一個按鈕（通常是對象jqXHR對象）。
要success(..)訪問按鈕，您可以節省預先其參考：

$(".up_button").click(function(){ 
    var idup_post=$(this).attr("data-idupactive"); 
    var userup_post=$(this).attr("data-userupactive"); 
    var button = this; 
    : 
    : 
    success : function(data) { 
    : 
    $(button).css(..); 
    }

或者更好的分配按鈕爲ajax(..)背景：

$(".up_button").click(function() { 
    var idup_post = $(this).attr("data-idupactive"); 
    var userup_post = $(this).attr("data-userupactive"); 

    $.ajax({ 
    context: this, // 'this' refers to button 
    : 
    success: function(data) { 
     // now `this` refers to the value of `context` 
    } 
});

見的jQuery 方面部分阿賈克斯documentation爲更多細節。

來源

2017-01-06 20:15:37 MaxZoom

非常感謝，它工作得很好（y） –

「這個」現在代表阿賈克斯請求您可以使用此代碼

$(".up_button").click(function(){ 
var idup_post=$(this).attr("data-idupactive"); 
var userup_post=$(this).attr("data-userupactive"); 

var up_btn = $(this); // put the button object inside var 

$.ajax({ 
    url:"ajax/up_actv.php", 
    data:{"idup":idup_post,"userup":userup_post}, 
    type:"POST", 
    success:function(data){ 

     if(data=="upactv"){ 
      alert(data); 
      up_btn.css({ // use the var insted of 'this' 
       "background-image":"url('icons/u.png')" 
      }); 
     } 
     if(data=="updisv"){ 
      alert(data); 
      up_btn.css({ // same thing 
       "background-image":"url('icons/uf.png')" 
      }); 
     } 


    } 

}); 

});

來源

2017-01-06 20:16:29 Nevo

是的，這是解決方案，謝謝（y） –

爲什麼$（this）.css在ajax成功中不起作用？

回答

相關問題