Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk menetapkan klik tetikus pada div untuk menyembunyikan div dalam jquery

Bagaimana untuk menetapkan klik tetikus pada div untuk menyembunyikan div dalam jquery

WBOY
WBOYasal
2022-03-22 15:31:151969semak imbas

Cara untuk menetapkan div untuk disembunyikan oleh jquery apabila mengklik tetikus: 1. Ikat acara klik pada elemen div dan tetapkan fungsi pemprosesan acara 2. Dalam fungsi pemprosesan acara, gunakan hide(; ) kaedah untuk menetapkan div untuk disembunyikan , sintaksnya ialah "div element object.hide()".

Bagaimana untuk menetapkan klik tetikus pada div untuk menyembunyikan div dalam jquery

Persekitaran pengendalian tutorial ini: sistem windows10, versi jquery3.2.1, komputer Dell G3.

Bagaimana untuk menetapkan jquery untuk menyembunyikan div apabila mengklik tetikus?

kaedah hide() menyembunyikan elemen yang dipilih.

Sintaksnya ialah:

$(selector).hide(speed,easing,callback)
  • kelajuan Pilihan. Menentukan seberapa cepat kesan itu disembunyikan.

Nilai yang mungkin:

ms "lambat" "cepat"

  • meringankan Pilihan. Menentukan kelajuan elemen pada titik yang berbeza dalam animasi. Nilai lalai ialah "swing".

Nilai yang mungkin:

"ayunan" - bergerak perlahan pada permulaan/akhir, pantas di tengah "linear" - bergerak pada kelajuan tetap Petua: Lebih banyak tersedia dalam sambungan Banyak fungsi pelonggaran tersedia.

  • panggilan balik Pilihan. Fungsi yang akan dilaksanakan selepas kaedah hide() dilaksanakan.

Apabila elemen diklik, peristiwa klik berlaku. Kaedah

klik() mencetuskan peristiwa klik atau menentukan fungsi untuk dijalankan apabila peristiwa klik berlaku.

Sintaksnya ialah:

Cetuskan acara klik bagi elemen yang dipilih:

$(selector).click()

Tambah fungsi pada acara klik:

$(selector).click(function)

Contohnya adalah seperti berikut:

<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>

Hasil output:

 5.gif

Tutorial video berkaitan yang disyorkan: Tutorial video jQuery

Atas ialah kandungan terperinci Bagaimana untuk menetapkan klik tetikus pada div untuk menyembunyikan div dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn