Heim >Web-Frontend >Front-End-Fragen und Antworten >So verbergen Sie Elemente mit der Maus in Javascript

So verbergen Sie Elemente mit der Maus in Javascript

WBOY
WBOYOriginal
2022-02-14 16:58:292355Durchsuche

Methode: 1. Verwenden Sie die Anweisung „Element object.click(function(){Hide element object.hide();})“, um den Mausklick so einzustellen, dass das Element ausgeblendet wird; 2. Verwenden Sie „Element object.dblclick(function (){Hide element Object.hide();})“ setzt das auszublendende Element per Doppelklick mit der Maus.

So verbergen Sie Elemente mit der Maus in Javascript

Die Betriebsumgebung dieses Tutorials: Windows 10-System, JavaScript-Version 1.8.5, Dell G3-Computer.

So verwenden Sie die Maus, um Elemente in JavaScript auszublenden

In JavaScript sind Mausereignisse die am häufigsten verwendeten Ereignistypen in der Webentwicklung. Die Mausereignistypen sind in der folgenden Tabelle aufgeführt:

So verbergen Sie Elemente mit der Maus in Javascript

hide()-Methode Wird verwendet, wenn ausgewählt. Das Element wird bereits angezeigt. Anschließend wird das Element ausgeblendet.

Die Syntax lautet:

$(selector).hide(speed,callback)

Geschwindigkeit

Optional. Gibt an, wie schnell ein Element von sichtbar zu ausgeblendet wechselt. Der Standardwert ist „0“.

Mögliche Werte:

ms (z. B. 1500)

„langsam“

„normal“

„schnell“

Mit der eingestellten Geschwindigkeit ändert sich das Element schrittweise von sichtbar zu ausgeblendet , Polsterung und Transparenz.

Rückruf

optional. Die Funktion, die nach der Ausführung der Ausblendfunktion ausgeführt werden soll.

Das Beispiel sieht wie folgt aus:

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $(".btn").click(function(){
  $(".btn").hide();
  });
});
</script>
<style>
.btn{
    width:100px;
    height:100px;
    background:pink;
}
</style>
</head>
<body>
<div class="btn">这是一个要被隐藏的元素</div>
</body>
</html>

Ausgabeergebnis:

So verbergen Sie Elemente mit der Maus in Javascript

Beispiel 2:

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $(".btn").dblclick(function(){
  $(".btn").hide();
  });
});
</script>
<style>
.btn{
    width:100px;
    height:100px;
    background:pink;
}
</style>
</head>
<body>
<div class="btn">这是一个要被隐藏的元素</div>
</body>
</html>

Ausgabeergebnis:

Sie müssen auf das ausgeblendete Element doppelklicken.

So verbergen Sie Elemente mit der Maus in Javascript

Verwandte Empfehlungen: Javascript-Lern-Tutorial

Das obige ist der detaillierte Inhalt vonSo verbergen Sie Elemente mit der Maus 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