Heim > Web-Frontend > js-Tutorial > Einfaches Beispiel eines von js dynamisch hinzugefügten Onclick-Ereignisses in DIV

Einfaches Beispiel eines von js dynamisch hinzugefügten Onclick-Ereignisses in DIV

高洛峰
Freigeben: 2016-12-24 15:20:13
Original
2003 Leute haben es durchsucht

Am einfachsten ist es:

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

Onclick-Ereignis dynamisch hinzufügen:

<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>
Nach dem Login kopieren

Wenn Sie die anonyme Funktion function(){} verwenden, ist dies wie folgt:

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

Die oben genannten Methoden sind tatsächlich dieselben Im Prinzip definieren alle den Wert des onclick-Attributs. Es ist zu beachten, dass, wenn obj.onclick = method1; obj.onclick = method3, nur die letzte Definition von obj.onclick = method3 wirksam wird. und die ersten beiden Definitionen werden wirksam. Die Definitionen von wurden durch die letzte überschrieben.

Sehen Sie sich das attachmentEvent im IE an:

<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>
Nach dem Login kopieren

Die Ausführungsreihenfolge ist Methode3 > Methode1, zuerst in, zuletzt out und Variablen auf dem Stapel sind ähnlich. Es ist zu beachten, dass der erste Parameter in attachmentEvent mit on beginnt, was onclick/onmouseover/onfocus usw. sein kann.

Es wird gesagt (ohne Bestätigung), dass es nach der Verwendung von attachmentEvent im IE am besten ist, es zu verwenden detachEvent, um es freizugeben.

Sehen Sie sich addEventListener in Firefox an:

<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>
Nach dem Login kopieren

Sie können sehen, dass die Ausführungsreihenfolge in ff Methode1 ist > ; method2 > method3 , genau das Gegenteil von IE, First In First Out. Es ist zu beachten, dass addEventListener über drei Parameter verfügt. Der erste ist der Ereignisname ohne „on“, z. B. click/mouseover/focus usw.

Das obige einfache Beispiel des von js dynamisch hinzugefügten Onclick-Ereignisses in einem DIV ist der gesamte vom Herausgeber geteilte Inhalt. Ich hoffe, dass es Ihnen eine Referenz geben kann, und ich hoffe, dass Sie die chinesische PHP-Website unterstützen.

Weitere einfache Beispiele für Onclick-Ereignisse in DIVs, die von js dynamisch hinzugefügt werden, finden Sie auf der chinesischen PHP-Website für verwandte Artikel!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage