Puis-je avoir onClick() de l'événement pour <h1> <h6> balises?

Je veux avoir onClick() de l'événement sur <h1> to <h6> (l'une des balises d'en-tête) pour l'exécution de javascript. Merci de me donner quelques exemple d'avoir onClick() de l'événement dans <h1> qui montre certaines alert() message.

Merci 🙂

InformationsquelleAutor Mohamed Saligh | 2010-11-28

10

Il est appelé la ligne d'événement d'enregistrement de modèle. Et oui, vous peut faire plus ou moins ce que vous demandez après.

Mais s'il vous plaît ne faites pas cela.

Anciennes et fiable, oui. Mais l'inconvénient est qu'il vous oblige à mettre votre JS comportements dans votre structure XHTML.

Vous êtes beaucoup mieux d'utiliser la marche suivante:
```
element.onclick = doSomething;
```
En jQuery, cela pourrait ressembler à quelque chose comme:
```
  $(":header").click(function(){
     alert('Handler for .click() called.')
   });
```
Bonne chance!
- Merci mec 🙂 fonctionne bien. Est-ce bon de faire de cette façon?
- En général, quelque chose comme ça (ou l'un des autres exemples posté) est presque toujours préférable d'enregistrer les comportements et les événements dans votre code HTML. Il est beaucoup plus facile à gérer.
InformationsquelleAutor Joseph Weissman

Si vous êtes prêt à utiliser jQuery, il est facile à manipuler.

$('h1, h2, h3, h4, h5, h6').click(function(){
    //do something on click
});

Si vous voulez une fonction différente à chaque niveau de l'en-tête, vous pouvez facilement le faire trop:

$('h1').click(function(){
    //do something on click
});

$('h2').click(function(){
    //do something on click
});

//Etc.

InformationsquelleAutor Surreal Dreams

1

Si vous ne voulez pas utiliser une librairie comme jQuery, voici un moyen de le manipuler:
```
var tags = ['h1','h2','h3','h4','h5','h6'];

for( var i in tags ){
    var these = document.getElementsByTagName(tags[i]);
    if( these.length ){
        for( var n=0,m=these.length;n<m;n++ ){
          these[n].addEventListener('click',function(){ 
            alert('hello'); 
          },false);
        }  
    }
}
```
Exemple: http://jsfiddle.net/redler/HvvVQ/

Comme @Ombre de l'Assistant de points dans les commentaires, c'est à dire utilise attachEvent au lieu de addEventListener, de sorte que cela fonctionne dans tous les navigateurs, vous aurez besoin d'un code qui fonctionne dans les deux sens. Si vous voulez éviter le trou de lapin de navigateur différences et le niveau de verbosité, la même chose peut être accompli dans jQuery comme ceci, par exemple:
```
$('h1,h2,h3,h4,h5,h6').click( function(){
  alert('hello');
});
```
Encore plus concis, grâce à @Kobi commentaire, est :header:
```
$(':header').click( function(){...} );
```
Je vous conseille d'aller avec une bibliothèque de votre choix pour faire ce genre de chose beaucoup plus facile.
- Vous pouvez également utiliser :header, qui je ne pense pas que j'ai jamais trouvé utile, jusqu'à aujourd'hui.
- le code ne fonctionne pas sur IE qui ne prend pas en charge la méthode addEventListener - croix-navigateur de code sera: if (these[n].addEventListener) these[n].addEventListener('click', function() { alert('hello'); }, false); else if (these[n].attachEvent) these[n].attachEvent('onclick', function() { alert('hello'); }); voici la mise à jour du lien: jsfiddle.net/HvvVQ/1
- bon. Que l'on n'arrive jamais à moi. @Shadow, ouais, c'est pas bon pour IE. J'ai pensé à jeter dans la version de IE que vous le décrire correctement, mais alors pensé que je recommanderais l'OP envisager une bibliothèque d'abstraction de tout ce que la douleur. J'ai modifié la réponse avec une meilleure clarté sur l'IE problème.
InformationsquelleAutor Ken Redler

Code :

<script>
    function handleOnClick() {
    alert("Clicked on h1 tag");
  }
</script>

<h1 onclick="handleOnClick()">
  I am h1 tag
</h1>

InformationsquelleAutor bvenkatr

Utiliser la fonction " mot de create function() et le code de la logique vient à l'intérieur des balises de script.

<html>
        <head> 
            <title>Understanding Tags in JS </title>
        </head>
        <body>
            <h1> Welcome to JavaScript Tutorial </h1>
            <h2 id = 'h2tag' onclick = "clickedMe()"> Click me to change </h2>
            <script>
                function clickedMe() {
                document.getElementById('h2tag').innerHTML = 'Alas ! I am clicked!'
            }
            </script>
        </body>
    </html>

Ajouter une description, il serait utile qu'un morceau de code.

InformationsquelleAutor Asa Richards

Vous devez vous connecter pour publier un commentaire.