jQuery sembunyikan dan tunjukkan


Kesan jQuery - Sembunyikan dan Tunjukkan

Contoh

jQuery hide()
Demonstrasi kaedah jQuery hide() yang mudah.

jQuery hide()
Satu lagi contoh hide(). Menunjukkan cara menyembunyikan teks.

jQuery hide() dan show()

Dengan jQuery, anda boleh menyembunyikan dan menunjukkan elemen HTML menggunakan kaedah hide() dan show():

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>
</head>
<body>
<p>如果你点击“隐藏” 按钮，我将会消失。</p>
<button id="hide">隐藏</button>
<button id="show">显示</button>
</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Sintaks:

$(pemilih).sembunyi(laju, panggil balik);

$(pemilih).tunjukkan(kelajuan,panggilan balik);

Parameter kelajuan pilihan menentukan kelajuan menyembunyikan/menunjukkan , yang boleh mengambil nilai berikut: "perlahan", "cepat" atau milisaat.

Parameter panggil balik pilihan ialah nama fungsi yang akan dilaksanakan selepas menyembunyikan atau menunjukkan selesai.

Contoh berikut menunjukkan kaedah hide() dengan parameter kelajuan:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").hide(1000);
  });
});
</script>
</head>
<body>
<button>隐藏</button>
<p>这是个段落，内容比较少。</p>
<p>这是另外一个小段落</p>
</body>
</html>

Running Instance»

Klik butang "Jalankan Instance" untuk melihat contoh dalam talian

jQuery toggle()

Dengan jQuery, anda boleh menggunakan kaedah toggle() untuk menukar kaedah hide () dan show().

Tunjukkan elemen tersembunyi dan sembunyikan elemen yang dipaparkan:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("p").toggle();
  });
});
</script>
</head>
<body>

<button>隐藏/显示</button>
<p>这是一个文本段落。</p>
<p>这是另外一个文本段落。</p>
</body>
</html>

Jalankan instance»

Klik butang "Jalankan Contoh" untuk melihat tika dalam talian

Sintaks:

$(pemilih). kelajuan,panggil balik);

Parameter kelajuan pilihan menentukan kelajuan bersembunyi/menunjukkan dan boleh mengambil nilai berikut: "perlahan", "cepat" atau milisaat.

Parameter panggil balik pilihan ialah nama fungsi yang akan dilaksanakan selepas kaedah togol() selesai.