mettre en évidence la rangée de table avec jquery

Je sais qu'il y a des tonnes de messages sur ce sujet, mais je suis perdu quant à pourquoi le mien ne fonctionne pas.

Je suis en train de mettre en surbrillance une ligne dans ma table:

<tr class="videorow"><td>...</td>...</tr>
...

css:

.highlight {
   background-color: #a8cb17;
}

et enfin mon jQuery:

jQuery(document).on("click", ".videorow", function() {

    //highlight table
    jQuery(".highlight").removeClass("highlight");
    jQuery(this).addClass("highlight");
});

Fondamentalement, je veux mettre en surbrillance une ligne et effacer lorsqu'une ligne est sélectionnée. C'est la première partie je ne peux même pas comprendre.

En outre, je tiens à souligner toute la ligne, sauf que je ne veux pas de la dernière colonne à déclencher une évidence. En d'autres termes, vous pouvez cliquer sur la dernière colonne de la ligne mais ça ne changera pas le mettre en surbrillance.

Quelque chose comme:

jQuery(document).on("click", ".videorow", function() {

    //highlight table
    jQuery(".highlight").removeClass("highlight");
    jQuery('table tr td:not(:last-child)').addClass("highlight");
});

Des conseils sur ces deux questions est apprécié.

MODIFIER: en tapant trop vite. Les erreurs de syntaxe sont juste m'écris au lieu de les copier...fixe maintenant

essayez de changer de css:.highlight { background-color: #a8cb17; } à: .highlight td{ background-color: #a8cb17; }
Outre les erreurs de syntaxe (votre deuxième sélecteur n'est pas dans une chaîne de caractères), c'est bien.
Quel est le comportement actuel vous voyez? Sans fournir une copie de travail, il est difficile de dire ce qui se passe.
semble bien jsfiddle.net/RRK2M/1
Ceci est incorrect. Il ne fait qu'essayer d'appliquer cette classe sur cliquez sur. Pas de défaut de charge
dans le premier chargement, il y a 0 tr avec classe highlight

InformationsquelleAutor Tom | 2013-05-07

css jquery

2

Essayez de vous assurer que vos TD est à l'intérieur de votre TR, pour commencer, qu'il n'est peut-être votre question, non pas de votre code, dans l'erreur.
```
<tr class="videorow">
<td>...</td>
</tr>
```
Ensuite, essayez de capturer l'événement click sur le <TD> -- pas sur la <TR>. Beaucoup de choses fonctionnent mieux sur les TD que sur TR.
```
$('document').on( "click", "tr.videorow td", function(ev) {
   console.log('click videorow event', ev);
   //do whatever.
});
```
Si vous ne pouvez pas le faire fonctionner, essayez juste de la capture sur "td" jusqu'à ce que vous pouvez obtenir le gestionnaire d'événements de travail & un message de log apparition. (Vous utilisez Chrome ou Firefox, je suppose.)

Fixation de l'événement-les maîtres de la table via un # sélecteur d'ID, plutôt que l'ensemble du document, peuvent aussi être plus efficace.
```
$('#MyTable').on( ...);
```
Tú Anh commentaire que pour le CSS en évidence, est également correcte. Faire appliquer le fond de la TD, pas le TR. Vous pouvez également essayer !important si vous rencontrez toujours des difficultés (mais voir http://css-tricks.com/when-using-important-is-the-right-choice/ pour plus d'info.)
```
.highlight td {background-color: #a8cb17 !important;}
```
Merci Anh! Espérons que cette aide.
- Mmdp, je suis perdu. Essayé de vos suggestions. cliquez sur l'événement est déclenché, mais pour une raison pas de mettre en évidence...
- Debug -- ajouter quelque chose d'autre (par exemple, une taille de police) à votre CSS, vérifiez dans "Inspecter l'Élément" si elle est appliquée, vérifiez le sélecteur jQuery qui est de l'appliquer.
- Bizarre, en ajoutant de la taille de la police des changements les lignes de polices comme prévu, mais encore la mise en évidence...je suis extraction de mes cheveux.
- Peut-être que vous avez de plus-CSS spécifique ou un style attribut sur le TD cellules, ce qui est de priorité plus élevée que la .mettre en évidence. Correctif, ou essayer !important dans votre point fort de style CSS.
- +1 je déteste CSS! Vous l'avez exactement. Merci pour coller avec moi. C'est quoi cette baisse de vote?
InformationsquelleAutor Thomas W

jQuery(document).on("click", "tr.videorow > td", function() {
    var $this = jQuery(this);

    //ignore clicks on last column
    if ( $this.is(":last-child") ) return;

    //unhighlight currently selected row
    jQuery(".highlight").removeClass("highlight");

    //change the highlight of the row        
    $this.parent().addClass("highlight");
});

InformationsquelleAutor nbrooks

0

Dans votre code, vous avez écrit:
```
jQuery(table tr td:not(:last-child)).addClass("highlight");
```
C'est l'erreur de syntaxe. Le paramètre passé à jQuery fonction n'est pas string. Changé pour celui-ci:
```
jQuery('table tr td:not(:last-child)').addClass("highlight");
```
InformationsquelleAutor
0

sur la ligne cliquez sur utiliser les paramètres suivants:
```
$('.row_selected').removeClass('row_selected');$(this).toggleClass('row_selected');
```
InformationsquelleAutor Mahmoud Saleh

Vous devez vous connecter pour publier un commentaire.