Jquery seleziona l'elemento selezionato all'interno di un insieme di elementi con lo stesso nome di classe

Question

Forse voi ragazzi potete aiutarmi con questo, ho lottato con esso per gli ultimi 30 minuti.

Diciamo che ho quattro elementi con la stessa classe.

<div class="test">hi</div> 
<div class="test">hey</div> 
<div class="test">yo</div> 
<div class="test">What's up</div> 

Come selezionare quello su cui è stato fatto clic?

sono stato in grado di farlo funzionare in questo modo:

$('.test').click(function() { 
    $(this).toggleClass("btn-danger btn-success"); 
}); 

Tuttavia, ho bisogno di sparare senza essere cliccato in caso di successo, dopo una chiamata AJAX, quindi ho bisogno di essere in grado di fare qualcosa del genere (tentativi falliti):

$('.test', this).toggleClass("btn-danger btn-success"); // This did not work 

$(this).find('.test').toggleClass("btn-danger btn-success"); // Also did not work 

Qualche suggerimento? Grazie mille!!

Answer 1

Suona come la chiamata AJAX è fatta quando uno degli elementi viene cliccato, ma è necessario passare valori diversi nel chiamata ajax a seconda dell'elemento su cui si fa clic. Invece di utilizzare un attributo "onclick", si potrebbe procedere come segue:

HTML:

<div class="test" data-param1="value1a" data-param2="value2a">hi</div> 
<div class="test" data-param1="value1b" data-param2="value2b">hey</div> 
<div class="test" data-param1="value1c" data-param2="value2c">yo</div> 
<div class="test" data-param1="value1d" data-param2="value2d">What's up</div> 

JavaScript:

$('.test').click(function() { 
    var $div = $(this); 
    $.ajax(url, { 
     data: { 
      param1: $div.attr('data-param1'), 
      param2: $div.attr('data-param2') 
     }, 
     success: function() { 
      $div.toggleClass("btn-danger btn-success"); 
     } 
    }); 
}); 

Naturalmente, è necessario impostare i valori dei data- attributi utilizzando Variabili PHP

Answer 2

Utilizzare la funzione trigger ....

Quindi fissare il gestore di clic ...

$('.test').on('click', function() { 
    $(this).toggleClass("btn-danger btn-success"); 
}); 

Poi nella funzione successo ajax .... trigger che cliccare ...

$('.test').trigger('click'); 

Ma determinare quale triggerare sarà il trucco.

Come fai a sapere quale fare clic in base all'ajax ????

Se stai solo facendo una chiamata AJAX, in base al quale collegare si CICK allora la soluzione è molto più semplice ....... perchè si sa già che è stato fatto clic collegamento

$('.test').click(function() { 
var link = $(this); 
$.ajax(url, { 
    success: function() { 
     link.toggleClass("btn-danger btn-success"); 
    } 
    }); 
}); 

Answer 3

E ' non è possibile dare a ciascuno di questi un ID così puoi accedervi direttamente?

Se si stanno attivando su una funzione di richiamata è possibile creare un riferimento al div cliccato in una variabile?

cioè

var clicked; 

$('.test').click(function(){ 
    clicked = $(this); 
}); 

poi nella vostra risposta Ajax:

clicked.toggleClass("btn-danger btn-success");