Heim >Web-Frontend >js-Tutorial >Detaillierte grafische Erläuterung der drei Methoden des jQuery-Schaltflächenklickereignisses
Detaillierte grafische Erläuterung der drei Methoden des jQuery-Schaltflächenklickereignisses
- yuliaOriginal
- 2018-10-12 10:25:369191Durchsuche
jQuery ist ein auf JavaScript basierendes Framework und wird aufgrund seiner Einfachheit und Bequemlichkeit häufig verwendet. Wissen Sie, wie man das Klickereignis der jQuery-Schaltfläche festlegt? In diesem Artikel erfahren Sie mehr über die Methode zum Auslösen von jQuery-Klicks. Interessierte Freunde können sich darauf beziehen.
Ein früherer Artikel hat Ihnen die Verarbeitungsmethode von Button-Klick-Ereignissen in JavaScript erklärt Wenn Sie es brauchen, können Sie einen Blick darauf werfen. Als nächstes erklären wir Ihnen direkt das jQuery-Button-Klick-Ereignis .
Hinweis: Wenn Sie jQuery verwenden, müssen Sie zuerst die jQuery-Datei einführen
Methode 1. $ ("button").click(function () { })
Ein Klickereignis tritt auf, wenn auf ein Klickelement geklickt wird. Die Methode click() kann ein Klickereignis auslösen, das festlegt, dass die Funktion wird ausgeführt, wenn ein Klickereignis auftritt.
Syntax: $(selector).click(function)
Beispiel: Wenn auf die Schaltfläche geklickt wird, wird das Klickereignis ausgelöst und im Dialogfeld wird ein Inhalt angezeigt.
Der Code lautet wie folgt:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<button>click</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
alert("祝你好运");
});
});
</script>
</html>Rendering:
Methode 2, $( "button").on("click",function () { })
on()-Methode kann ein oder mehrere Ereignisse zu ausgewählten Elementen und Unterelementen hinzufügen, wenn Sie Ereignisse löschen müssen , können Sie die Methode off() verwenden.
Syntax: $(selector).on(event,childSelector,data,function)
Der Code lautet wie folgt:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<button>点我</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("button").on("click",function(){
alert("have a nice day ");
});
});
</script>
</html>Methode 3, $( "button" ).bind("click",function(){ })
Die Methode bind() kann dem ausgewählten Element ein oder mehrere Ereignisse hinzufügen, und die Funktion wird ausgeführt, wenn das Ereignis eintritt auftritt.
Syntax: $(selector).bind(event,data,function,map)
Der Code lautet wie folgt:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<button>按钮</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("button").bind("click",function(){
alert("阳光总在风雨后");
});
});
</script>
</html>Oben werden die drei Arten von Schaltflächen vorgestellt Die Auswahl der Klickereignisse in jQuery hängt auch von den Arbeitsanforderungen und persönlichen Gewohnheiten ab. Ich hoffe, dieser Artikel kann Ihnen helfen.
Weitere verwandte Tutorials finden Sie unter jQuery-Video-Tutorial
Das obige ist der detaillierte Inhalt vonDetaillierte grafische Erläuterung der drei Methoden des jQuery-Schaltflächenklickereignisses. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!