Heim > Artikel > Web-Frontend > Beispiele für die Verwendung von Show- und Hide-Methoden in jQuery

Beispiele für die Verwendung von Show- und Hide-Methoden in jQuery

巴扎黑Original: 2017-06-29 10:45:112730Durchsuche

In diesem Artikel wird hauptsächlich die Verwendung von Show- und Hide-Methoden in jQuery vorgestellt und die einfachen Implementierungstechniken von jQuery mithilfe von Show- und Hide-Methoden zur Steuerung der Anzeige und Ausblendung von Seitenelementen anhand von Beispielen analysiert dazu

Dieser Artikel analysiert die Verwendung von Show- und Hide-Methoden in jQuery anhand von Beispielen. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
  <style type="text/css">
    *{font-size:12px;}
    p{width:600px;margin:auto;}
    #control{background-color:gold;padding:10px;}
  </style>
  <script src="../js/jquery-1.5.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      $("#btnDisplay").click(function () {
        $("#message").show(3000);
      });
      $("#btnHide").click(function () {
        $("#message").hide(3000);
      });
    });
  </script>
</head>
<body>
  <p id="control">
    <input id="btnDisplay" type="button" value="显示p" />
    <input id="btnHide" type="button" value="隐藏p" />
  </p>
  <p id="message">
    mouseover、mouseenter的区别：p里套p。见备注。和事件冒泡有关系。<br /> 
    不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件 <br />
    只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件(穿过子元素不会触发)
  </p>
</body>
</html>

Das obige ist der detaillierte Inhalt vonBeispiele für die Verwendung von Show- und Hide-Methoden in jQuery. 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：Detaillierte Erläuterung einfacher Beispiele für Timerfunktionen, die in JS implementiert sindNächster Artikel：Detaillierte Erläuterung einfacher Beispiele für Timerfunktionen, die in JS implementiert sind

In Verbindung stehende Artikel

Mehr sehen