Comment mettre à jour la couleur d'arrière-plan de la ligne du tableau dans IE en utilisant Javascript/CSS?

J'ai une table que je veux mettre en surbrillance pendant onmouseover/onmouseout. Je sais déjà que c'est nécessaire dans IE mais pas dans les autres navigateurs.Comment mettre à jour la couleur d'arrière-plan de la ligne du tableau dans IE en utilisant Javascript/CSS?

j'ai réussi à détecter les événements déclencheurs et cette balise TR fonctionne efficacement. (Notez que semble le « contentTableRow » de classe d'origine ne pas causer des problèmes.)

class="contentTableRow" onclick="openForm('SomeID');" onmouseover="highlight('someRowID', true);" onmouseout="highlight('someRowID', false);" id="someRowID"

Tout va bien et dandy, les feux de la fonction de « mettre en évidence » et définit en fait la classe appropriée.

Il est juste que IE ne traitera pas le changement de nom de classe CSS.

Voici un extrait du CSS j'utilise pour faire le changement.

.HighlightOn { 
    cursor:pointer; 
    background-color: #D1DFFF; 
} 

.HighlightOff { 
    background-color: #E1EEFE; 
}

je peux voir que les noms de classe sont mis à jour lorsque se debugger, et vérifier aussi dans Firebug. Mais il semble que IE n'aime pas cet usage de classes avec une balise TR. Est-ce la façon dont je structure la classe pour les tables? Aucun conseil ?

Source

2010-04-13 giulio

Pouvez-vous poster le code pour la méthode de surbrillance? – Jonathan

Essayez d'appliquer l'arrière-plan directement aux cellules du tableau: '.HighlightOn td, .HighlightOn th' etc. AFAIK IE est un peu gênant en ce qui concerne le style visuel sur les lignes de table (' '). – jensgram

@Jensgram. Je pense que tu es sur quelque chose. Va poster quelque chose sous peu. – giulio

CHANGENT vous class au lieu de className? class est réservé en Javascript comme mot-clé de déclaration de classe réelle, de sorte que la propriété est appelée className:

function highlight(id, b) { 
    document.getElementById(id).className = (b ? "HighlightOn" : "HighlightOff"); 
}

Soit dit en passant, vous pourriez vouloir passer « ce » pour mettre en évidence la place de l'identifiant, donc il n'a pas besoin pour faire le document.getElementById() appel

Source

2010-04-13 05:14:07

Ceci est un code sympa. Très propre. Mais le problème semble être lié à la manière dont IE traite le CSS. Je peux voir que la classe est assignée, et CSS est "en quelque sorte" reconnu parce que le paramètre "curseur" fonctionne. Juste pas la mise à jour de couleur d'arrière-plan .. Bizarre .. mais encore une fois, c'est IE. – giulio

J'ai up'd votre commentaire pour l'info .. merci – giulio

IE ne reconnaît pas « classe » en JavaScript. Vous devez utiliser "className" comme propriété dans IE.

Source

2010-04-13 05:17:04

Oui .. Merci jeff. Mais ce n'est pas le problème. – giulio

Merci pour tous les pointeurs. Mais cela semble avoir fonctionné.

TR.HighlightOn td { 
    cursor:pointer; 
    background-color: #D1DFFF; 
} 

TR.HighlightOff td { 
    cursor:pointer; 
    background-color: #E1EEFE; 
}

Fondamentalement doivent être explicites dans ce cas sur l'endroit où la classe est utilisée dans le code HTML.

Notez que je devais faire référence à la balise TR et les balises de TD par rapport à l'endroit où j'utilise les classes Highlighton/off dans le tableau. Merci jensgram.

Espérons que cela aide quelqu'un d'autre avec le même problème.

(merci Jensgram pour le lead)

Source

2010-04-13 09:04:41 giulio

Comment mettre à jour la couleur d'arrière-plan de la ligne du tableau dans IE en utilisant Javascript/CSS?

Répondre

Questions connexes