Ajax（this）not working

Question

$ containerの '.box'クラスにアクセスしようとすると、ajax呼び出しの中で（this）を使用しても機能しません。

$container.on(
     "click", 
     ".box", 
     function(event){ 
      var description; 
      if($(this)[0].style.width == '70%'){ 
       $(this).find(".resultData").fadeOut('slow'); 
       $(this).css('width', '18%'); 
      }else{ 
       $.ajax({ 
        url:'scripts/php/fetchResultsData.php', 
        data: {action:value}, 
        type: 'post', 
        dataType: 'json', 
        success: function(data){ 
         description = data[0]; 
         $(this).css('width', '70%'); 
         $(this).append("\ 
          <div class='resultData'>\ 
           <div class='resultName'>" + $(this).find("p").html() + "</div>\ 
           <div class='resultDesc'>" + description +"</div>\ 
          </div>"); 
         /*alert($(this).find("p").html());*/ 
        } 
        }) 
      } 
      $container.masonry('reload'); 
     } 
    ); 

私が何をしようとしているかわからない場合は、動的要素のCSSを変更しようとしています。しかし、例えば、

$(this).css('width','70%');

は、すべてのCSSを調整されていません。私がAJAX、成功セクションの外に移動すると、それは動作しますが、私は '記述'を得ることができません。

Answer 1

もうすぐです。 'this'はあなたが使っている文脈では、イベントを発行したものではなく、ajaxリクエストを指します。この問題を解決するには、AJAXリクエストを行う前に、こののコピーを格納します。

    }else{ 
         var me = this; 
         $.ajax({ 
          ... 
          success: function(data){ 
           description = data[0]; 
           $(me).css('width', '70%'); 

Answer 2

だけ...あなたの$.ajaxコールに

context: this, 

これを追加...それがうまくいきます。経験則として

---

$.ajax({ 
    context: this, // <-- right here 
    url:'scripts/php/fetchResultsData.php', 
    data: {action:value}, 
    type: 'post', 
    dataType: 'json', 
    success: function(data) { // ...