Maison  >  Article  >  interface Web  >  Exemple simple d'événement onclick dans DIV ajouté dynamiquement par js

Exemple simple d'événement onclick dans DIV ajouté dynamiquement par js

高洛峰
高洛峰original
2016-12-24 15:20:131966parcourir

Le plus simple est celui-ci :

<input type="button" onclick="alert(this.value)" value="我是 button" />

Ajouter dynamiquement un événement onclick :

<input type="button" value="我是 button" id="bu">
<script type="text/javascript">
var bObj=document.getElementById("bu");
bObj.onclick= objclick;
function objclick(){alert(this.value)};
</script>

Si vous utilisez la fonction anonyme function(){}, elle se présente comme suit :

<input type="button" value="我是 button" id="bu">
<script type="text/javascript">
var bObj=document.getElementById("bu");
bObj.onclick=function(){alert(this.value)};
</script>

Les méthodes ci-dessus sont en fait les mêmes en principe, tous définissent la valeur de l'attribut onclick. Il convient de noter que si obj.onclick est défini plusieurs fois, par exemple : obj.onclick=method1; obj.onclick=method2; obj.onclick=method3, alors seule la dernière définition de obj.onclick=method3 prendra effet, et les deux premières définitions prendront effet. Les définitions de ont été écrasées par la dernière.

Regardez l'attacheEvent dans IE :

<input type="button" value="我是拉登" id="bu">
<script type="text/javascript">
var bObj = document.getElementById("bu");
bObj.attachEvent("onclick",method1);
bObj.attachEvent("onclick",method2);
bObj.attachEvent("onclick",method3);
function method1(){alert("第一个alert")}
function method2(){alert("第二个alert")}
function method3(){alert("第三个alert")}
</script>

L'ordre d'exécution est méthode3 > méthode2 > out, et les variables sur la pile sont similaires. Il est à noter que le premier paramètre de attachEvent commence par on, qui peut être onclick/onmouseover/onfocus, etc.

On dit (sans confirmation) qu'après avoir utilisé attachEvent dans IE, il est préférable d'utiliser detachEvent pour le libérer. Mémoire

Regardez addEventListener dans Firefox :

<input type="button" value="我是布什" id="bu">
<script type="text/javascript">
var bObj = document.getElementById("bu");
bObj.addEventListener("click",method1,false);
bObj.addEventListener("click",method2,false);
bObj.addEventListener("click",method3,false);
function method1(){alert("第一个alert")}
function method2(){alert("第二个alert")}
function method3(){alert("第三个alert")}
</script>

Vous pouvez voir que l'ordre d'exécution dans ff est méthode1. > ; méthode2 > méthode3 , juste le contraire d'IE, premier entré, premier sorti. Il convient de noter que addEventListener a trois paramètres. Le premier est le nom de l'événement sans "on", tel que clic/survol/focus, etc.

L'exemple simple ci-dessus de l'événement onclick dans un DIV ajouté dynamiquement par js est tout le contenu partagé par l'éditeur. J'espère qu'il pourra vous donner une référence, et j'espère que vous soutiendrez le site Web PHP chinois.


Pour des exemples plus simples d'événements onclick dans les DIV ajoutés dynamiquement par js, veuillez faire attention au site Web PHP chinois pour les articles connexes !


Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn