Heim > Artikel > Web-Frontend > So stellen Sie JQuery so ein, dass das Div ausgeblendet wird, wenn die Maus darauf klickt
So stellen Sie JQuery so ein, dass das Div ausgeblendet wird, wenn die Maus darauf klickt
- WBOYOriginal
- 2022-03-22 15:31:151975Durchsuche
So legen Sie fest, dass das Div beim Klicken mit der Maus von jquery ausgeblendet wird: 1. Binden Sie das Klickereignis an das div-Element und legen Sie die Ereignisverarbeitungsfunktion fest. 2. Verwenden Sie zum Festlegen die Methode hide () in der Ereignisverarbeitungsfunktion Das Div, das ausgeblendet werden soll, und die Syntax lautet „div element object.hide()“.
Die Betriebsumgebung dieses Tutorials: Windows10-System, JQuery3.2.1-Version, Dell G3-Computer.
So stellen Sie JQuery so ein, dass das Div ausgeblendet wird, wenn die Maus darauf klickt. Die Methode „hide()“ blendet das ausgewählte Element aus.
Die Syntax lautet:
$(selector).hide(speed,easing,callback)
- speed Optional. Gibt an, wie schnell der Effekt ausgeblendet wird.
- Mögliche Werte:
ms „langsam“ „schnell“
- easing Optional. Gibt die Geschwindigkeit des Elements an verschiedenen Punkten in der Animation an. Der Standardwert ist „swing“.
- Mögliche Werte:
„swing“ – bewegt sich langsam am Anfang/Ende, bewegt sich schnell in der Mitte „linear“ – bewegt sich mit konstanter Geschwindigkeit Tipp: In der Erweiterung stehen weitere Beschleunigungsfunktionen zur Verfügung.
- Rückruf Optional. Die Funktion, die ausgeführt werden soll, nachdem die Methode hide() ausgeführt wurde.
- Wenn auf ein Element geklickt wird, tritt das Klickereignis auf. Die
click()-Methode löst ein Klickereignis aus oder gibt eine Funktion an, die ausgeführt werden soll, wenn ein Klickereignis auftritt.
Die Syntax lautet:
Lösen Sie das Klickereignis des ausgewählten Elements aus:
$(selector).click()
Fügen Sie dem Klickereignis eine Funktion hinzu:
$(selector).click(function)
Das Beispiel lautet wie folgt:
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("div").click(function(){
$("div").hide();
});
});
</script>
</head>
<body>
<div style="width:100px;height:100px;border:1px solid red;"></div>
</body>
</html>Ausgabeergebnis:
Empfohlene Verwandte Video-Tutorials:
Das obige ist der detaillierte Inhalt vonSo stellen Sie JQuery so ein, dass das Div ausgeblendet wird, wenn die Maus darauf klickt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!