Ajax (ten) nie działa

Question

Podczas próby uzyskania dostępu do klasy ".box" kontenera $, użycie (this) wewnątrz wywołania ajax nie działa.

$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'); 
     } 
    ); 

Jeśli nie jest jasne, co próbuję zrobić, próbuję zmienić elementy dynamiczne. Ale na przykład

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

nie dostosowuje css w ogóle. Jeśli przeniesię go poza dział ajax, success, to działa, ale nie mogę uzyskać "opisu".

Answer 1

Jesteś blisko. "To" w kontekście, w którym go używasz, odnosi się do żądania ajax, a nie do rzeczy, która wydała wydarzenie. Aby rozwiązać ten problem, należy przechowywać kopię tego przed dokonaniem żądania ajax:

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

Answer 2

Wystarczy dodać do swojej rozmowy $.ajax ...

context: this, 

... i będzie to działać.

---

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