Heim > Artikel > Web-Frontend > Welche Methoden zur Ereignisbehandlung gibt es in Javascript?
Welche Methoden zur Ereignisbehandlung gibt es in Javascript?
- 青灯夜游Original
- 2021-10-08 15:30:313850Durchsuche
Die Methoden der Ereignisverarbeitung in JavaScript sind: 1. Fügen Sie ein Ereignis im Ereignisattribut des Labels hinzu. Die Syntax lautet „
Die Betriebsumgebung dieses Tutorials: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.
Javascript-Ereignisbehandlungsmethode
Methode 1. Fügen Sie ein Ereignis im Ereignisattribut des Tags hinzu
Verwenden Sie das Ereignisattribut des HTML-Tags, um den Handler zu binden. Es ist zu beachten, dass bei Verwendung des Ereignisattributs eines HTML-Tags zum Binden eines Ereignishandlers der Skriptcode im Ereignisattribut keine Funktionsdeklaration enthalten kann, sondern ein Funktionsaufruf oder eine Reihe von durch Semikolons getrennten Skriptcodes sein kann.
Beispiel:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script>
function printName(){
var name = "张三";
alert(name);
}
</script>
</head>
<body>
<input type="button" onClick="printName()" value="事件绑定测试"/>
</body>
</html>
Methode 2. Verwenden Sie das Ereignisattribut der Ereignisquelle, um den Handler zu binden.
Eine Möglichkeit, HTML und JS zu trennen, besteht darin, den Ereignishandler mithilfe des Ereignisattributs der zu binden Ereignisquelle. Funktion, das Bindungsformat ist wie folgt:
obj.on事件名 = 事件处理函数
obj im Format ist das Ereignisquellenobjekt. Das gebundene Ereignisprogramm ist normalerweise die Definitionsanweisung einer anonymen Funktion oder ein Funktionsname.
Beispiel für die Bindung des Handlers an die Ereigniseigenschaft der Ereignisquelle:
oBtn.onclick = function(){//oBtn为事件源对象，它的单击事件绑定了一个匿名函数定义
alert('hi')
};Beispiel: Bindung der Ereignishandlerfunktion mithilfe der Ereigniseigenschaft der Ereignisquelle.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script>
window.onload = function(){//窗口加载事件绑定了一个匿名函数
//定义一个名为fn的函数
function fn(){
alert('hello');
}
//获取事件源对象
var oBtn1 = document.getElementById("btn1");
var oBtn2 = document.getElementById("btn2");
//绑定一个匿名函数
oBtn1.onclick = function(){
alert("hi");
}
//绑定一个函数名
oBtn2.onclick = fn;
};
</script>
</head>
<body>
<input type="button" id="btn1" value="绑定一个匿名函数">
<input type="button" id="btn2" value="绑定一个函数名">
</body>
</html>【Empfohlenes Lernen: Javascript-Tutorial für Fortgeschrittene】
Das obige ist der detaillierte Inhalt vonWelche Methoden zur Ereignisbehandlung gibt es in Javascript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!