Heim > Artikel > Web-Frontend > Vertiefende Kenntnisse zum Umgang mit Schaltflächenklickereignissen in JavaScript

Vertiefende Kenntnisse zum Umgang mit Schaltflächenklickereignissen in JavaScript

yuliaOriginal: 2018-10-11 10:12:346925Durchsuche

JavaScript wird häufig in der Front-End-Entwicklung verwendet. Wissen Sie also, wie Sie das Klickereignis der JS-Schaltfläche festlegen? In diesem Artikel erfahren Sie mehr über die Verarbeitungsmethode von Click-Events in JS. Interessierte Freunde können einen Blick darauf werfen.

1. Verwenden Sie die Methode btn.click()

Die Methode btn.click() dient zum Klicken auf die Schaltfläche durch das Programm und löst so den Onclick-Befehl der Schaltfläche aus. )-Ereignis. Der Code lautet wie folgt:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <body>
  <button onclick="myFunction()">点我</button>
 </body>
 <script type="text/javascript">
  function myFunction(){
   alert("have a nice day ")
  }
 </script>  
</html>

Rendering:

Vertiefende Kenntnisse zum Umgang mit Schaltflächenklickereignissen in JavaScript

2. Verwenden Sie die Methode addEvenListener()

addEventListener() Die Methode kann Ereignisse zum angegebenen Element hinzufügen. Der Code lautet wie folgt:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <body>
  <button id="btn">点击</button>
 </body>
 <script type="text/javascript">
  var btn = document.getElementById("btn");
  btn.addEventListener(&#39;click&#39;,function(){
   alert("技术是我一生的追求");
  },false)
 </script>
</html>

Rendering:

Vertiefende Kenntnisse zum Umgang mit Schaltflächenklickereignissen in JavaScript

3 . Verwenden Sie die Methode btn.onclick=function( )

Methode btn.onclick() ruft einfach die Methode auf, auf die durch Klicken auf die Schaltfläche btn verwiesen wird, und löst das Ereignis nicht aus. Der Code lautet wie folgt:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <body>
  <button id="btn">click</button>
 </body>
 <script type="text/javascript">
  var btn = document.getElementById("btn");
  btn.onclick=function(){
   alert("欢迎大家来PHP中文网学习");
  }
 </script>
</html>

Rendering:

Vertiefende Kenntnisse zum Umgang mit Schaltflächenklickereignissen in JavaScript

Das Obige stellt hauptsächlich die drei Verarbeitungsmethoden von Schaltflächenklickereignissen in JavaScript vor. Jede ist anders. Welche Methode Sie wählen sollten, hängt von Ihren Arbeitsanforderungen und persönlichen Gewohnheiten ab. Anfänger können es selbst ausprobieren. Ich hoffe, dieser Artikel kann Ihnen helfen.

Weitere verwandte Tutorials finden Sie unter JavaScript-Video-Tutorial

Das obige ist der detaillierte Inhalt vonVertiefende Kenntnisse zum Umgang mit Schaltflächenklickereignissen in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

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

Vorheriger Artikel：Was bedeutet Ajax? Wie verwende ich Ajax?Nächster Artikel：Was bedeutet Ajax? Wie verwende ich Ajax?

In Verbindung stehende Artikel

Mehr sehen