Selezione delle righe in tablesorter
-
20-09-2019 - |
Domanda
tablesorter un plugin jQuery (sono sicuro che altro sapere) nel mio progetto. Ho bisogno di aggiungere una caratteristica in cui in cui gli utenti fanno clic su una riga, ottiene selezionato. Ho provato il seguente codice, ma, non è il lavoro fuori.
$('#myTable tr').click(function(event) {
$(this).addClass('selected');
});
Qualcuno potrebbe dirmi il modo migliore per farlo? C'è qualche plug-in già per questo?
Grazie in anticipo,
Abdel Olakara
Soluzione
Credo che tablesorter ricrea l'intera tabella in modo che potrebbe essere il motivo per cui non c'è alcun cambiamento in quanto "distrugge" l'evento click attaccato al TR. Si dovrebbe provare con un evento dal vivo e vedere se funziona: documentazione per gli eventi live in jQuery.com
Altri suggerimenti
Per consentire selezionare e deselezionare commutando tramite toggleClass di jQuery:
$(document).ready( function() {
/* jQuery v1.11.1 */
$( "table.tablesorter tbody tr" ).click(function() {
$( this ).toggleClass( "selected" );
});
});
/* CSS for hover row & select/lock the row with color */
table.tablesorter tbody tr:hover td {
background-color: #f4f5f6;
}
table.tablesorter tbody tr.selected td {
background-color: #f4f5f6;
}
Che sembra corretto per me. Avete una classe CSS definita per tr.selected?
Forse quando si fa clic, si colpisce l'elemento td e non tr. Forse è necessario utilizzare il genitore:
http://docs.jquery.com/Traversing/parent
qualcosa di simile (non testata):
$('#myTable td').click(function(event) {
$(this).parent("tr").addClass('selected');
});
Quello che devi appare corretta. Stai eseguendo dopo il documento è pronto?
$(function() {
$('#myTable tr').click(function() {
$(this).addClass('selected');
});
});
In alternativa, è possibile utilizzare live
eventi.
$('#myTable tr').live('click', function() {
$(this).addClass('selected');
});
Il tuo evento click sembra funzionare bene sul mio tavolo, mi chiedo solo come si dovrebbe deselezionare cliccando di nuovo? legando una variabile se è viene selezionato sembra una soluzione facile, ma come faccio a farlo?
Pardon My rispondere alla tua domanda con un'altra domanda e la mia novità di JS.