2009-08-17 12 views
3

J'ai une durée HTML qui change sa catégorie onmouseover et onmouseout:Comment modifier un événement onmouseover en utilisant Javascript?

<span id="someSpan" class="static" onmouseover="this.className='active'" onmouseout="this.className='static'">Some Text</span> 

Je veux être en mesure d'activer et de désactiver (modifier) ​​les onmouseover et onmouseout événements en utilisant une fonction Javascript appelé ailleurs sur la page. Est-ce possible?

Répondre

2

Bien sûr.

document.getElementById('someSpan').onmouseover = 
    function() { 
     this.className='newactive'; 
    }; 
+0

Merci, j'aimerais accepter cette réponse et celle de Jason. Cela fonctionne comme souhaité pour mon prototype mais je regarderai comment faire ceci en utilisant JQuery plus tard. – Trastle

1

La méthode la plus sûre consiste à utiliser une boîte à outils Javascript comme Prototype ou JQuery.

Ils peuvent tous faire des choses comme ça facilement, mais cela fonctionne multi-navigateur.

Par exemple, here is how you do it in JQuery.

0

code:

document.getElementById("someSpan").onmouseover = function() 
{ 
    //New code 
};//Do not forget the semicolon 
1

Je suis d'accord jQuery serait plus facile, mais si vous voulez en tenir à JavaScript, je crois que cela devrait fonctionner:

document.getElementById ("elementId ") .onMouseOut = nomFonction;

De plus, jQuery mesure environ 20 Ko (taille du fichier de cadre de production), ce qui peut ralentir le chargement de votre page. Quelque chose à considérer si vous l'utilisez juste pour quelques choses qui peuvent être faites en JavaScript.

1

Oui, vous pouvez le faire simplement en attribuant à la onmouseover et onmouseout propriétés de l'instance d'élément pour la durée, par exemple:

// Define your handler somewhere 
function myNewHandler() 
{ 
    // ...new logic... 
} 

// And where you want to swap it in: 
document.getElementById('someSpan').onmouseover = myNewHandler; 

... mais ceci est une façon de faire assez ancienne ce. Une approche plus moderne utilise addEventListener ou attachEvent (selon que vous utilisez standard ou IE) pour connecter des gestionnaires d'événements. Des bibliothèques comme Prototype, jQuery et une douzaine d'autres peuvent aider.

Questions connexes