jQuery - come verificare se due elementi sono uguali?

Question

Ho bisogno di passare un elemento a una funzione e poi abbinare quell'elemento specifico mentre attraversi il genitore. La presa (per qualcuno che non sa come me) è che questo elemento non ha un ID. Nel seguente esempio, voglio che ogni elemento per accendere rosa tranne quello cliccato che dovrebbe diventare giallo

function colorize(element) { 
    element.parent().find('span').each(function() { 
     if ($(this)===element) { // the problem is this is always false 
      $(this).css('background','yellow'); 
     } else { 
      $(this).css('background','pink'); 
     } 
    }); 
} 
$('span').click(function() { 
    colorize($(this)); 
}); 

Answer 1

Confronto di oggetti JQuery non tornerà mai più vero, perché ogni oggetto JQuery è aa nuovo oggetto, anche se i loro selettori sono pari.

Per confrontare gli elementi, è necessario verificare se gli elementi DOM sono uguali:

this === element.get(0); 

Answer 2

Non è necessario. Stai sempre applicando lo stile speciale a un elemento specifico, quindi colorali tutti, quindi modifica il colore dell'elemento specifico.

function colorize(element) { 
    element.parent().find('span').each(function() { 
     $(this).css('background','pink'); 
    }); 

    element.css('background','yellow'); 
} 

Il problema con il confronto è stato che di comparare due oggetti (oggetti jQuery). Quando si confrontano gli oggetti, a meno che non stanno puntano alla stessa cosa, essi sono considerati diseguale:

var o1 = {}; 
var o2 = {}; 
o1 !== o2; 

È possibile aggirare il problema rimuovendo l'involucro jQuery:

function colorize(element) { 
    var realElement = element[0]; 

    element.parent().find('span').each(function() { 
     if (this === realElement) { 
      $(this).css('background','yellow'); 
     } else { 
      $(this).css('background','pink'); 
     } 
    }); 
} 

In questo modo, sei confronto di elementi DOM con elementi DOM e non di mele in arance o oggetti in oggetti.

Answer 3

Usa isEqualNode

this.isEqualNode(element) 

Oppure utilizzare isSameNode (deprecato)

this.isSameNode(element) 

Answer 4

È possibile utilizzare la funzione di jQuery is(). La risposta originale può essere trovata here.

function colorize(element) { 
    element.parent().find('span').each(function() { 
     if ($(this).is(element)) { 
      $(this).css('background','yellow'); 
     } else { 
      $(this).css('background','pink'); 
     } 
    }); 
}