Yocker
  1. Yocker
  3. $ (this) all’interno del successo AJAX non funziona
Intereting Posts
Come posso installare la versione VS2017 di msbuild su un build server senza installare l’IDE? Come posso annullare un checkout in git? Posizione del cursore in una textarea (indice dei caratteri, non coordinate x / y) Errore Sql Server ‘Salvataggio delle modifiche non consentito’ ► Impedire il salvataggio delle modifiche che richiedono la creazione di una tabella JSON ha lasciato fuori Infinity e NaN; Stato JSON in ECMAScript? In Firebase quando si usa push () Come faccio a tirare l’ID univoco Implementazione della distanza di Levenshtein per la ricerca mysql / fuzzy? Convertire un object in una stringa Come trovare il controllo che ho aggiunto alla forma? Doppi punti di Ruby (: :) differenze di utilizzo dell’operatore Modello tupla – chiama una funzione su ciascun elemento Perché una variabile “locale” non definitiva non può essere usata all’interno di una class interna, e invece un campo non finale della class che lo contiene può? NSUserDefaults non funziona su Xcode beta con Watch OS2 In ordine successore in albero di ricerca binaria Intero file di testo in una stringa in Java

$ (this) all’interno del successo AJAX non funziona

Sto cercando di modificare un vecchio codice che utilizza onclick in modo che io possa usare $ (questo). Il problema è che $ (questo) non funziona quando si trova all’interno del successo. C’è comunque da fare senza impostarlo come var. 

$('.addToCart').click(function() { $.ajax({ url: 'cart/update', type: 'post', data: 'product_id=' + $(this).attr("data-id"), dataType: 'json', success: function(json) { if (json['success']) { $(this).addClass("test"); } } }); });

Problema

All’interno del callback, this riferisce all’object jqXHR della chiamata Ajax, non all’elemento al quale è stato associato il gestore eventi. Ulteriori informazioni su come funziona in JavaScript .

soluzioni

Se ES2015 + è disponibile per te, quindi usare una funzione a freccia potrebbe essere l’opzione più semplice: 

 $.ajax({ //... success: (json) => { // `this` refers to whatever `this` refers to outside the function } });

È ansible impostare l’ opzione di context :

Questo object sarà reso il contesto di tutti i callback relativi ad Ajax. Per impostazione predefinita, il contesto è un object che rappresenta le impostazioni ajax utilizzate nella chiamata ( $.ajaxSettings unite con le impostazioni passate a $.ajax ). (…) 

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

o usa $.proxy : 

 $.ajax({ //... success: $.proxy(function(json) { // `this` refers to the second argument of `$.proxy` }, this) });

o mantenere un riferimento al valore di this al di fuori del callback: 

 var element = this; $.ajax({ //... success: function(json) { // `this` refers to the jQXHR object // use `element` to refer to the DOM element // or `$(element)` to refer to the jQuery object } });

Relazionato

  • Come accedere al corretto `this` all’interno di un callback? 
 jQuery(".custom-filter-options .sbHolder ul li a").each(function () { var myStr = jQuery(this).text(); var myArr = myStr.split(" ("); url = 'your url'; // New Code data = myArr[0]; try { jQuery.ajax({ url : url, context: this, type : 'post', data : data, success : function(data) { if(data){ jQuery(this).html(data); }else{ jQuery(this).html(myArr[0]); } } }); } catch (e) { } });