Saya ingin tahu apakah ini cara yang benar untuk menyembunyikan elemen yang terlihat saat diklik di mana pun pada halaman.
$(document).click(function (event) {
$('#myDIV:visible').hide();
});
Elemen (div, span, dll.) Tidak boleh hilang saat peristiwa klik terjadi dalam batas-batas elemen.
jquery
events
event-bubbling
Franek
sumber
sumber
.myDiv
elemen. Misalnya, jika Anda memiliki dropdown pilih di dalam.myDiv
. Ketika Anda mengklik pilih, itu akan mengira Anda mengklik di luar kotak.Coba ini
Saya menggunakan nama kelas, bukan ID , karena di asp.net Anda harus khawatir tentang hal-hal ekstra yang dilampirkan .net ke id
EDIT- Karena Anda menambahkan bagian lain, itu akan berfungsi seperti ini:
sumber
Mulai jQuery 1.7, ada cara baru untuk menangani acara. Saya pikir saya akan menjawab di sini hanya untuk menunjukkan bagaimana saya bisa melakukan ini dengan cara "baru". Jika belum, saya sarankan Anda membaca dokumen jQuery untuk metode "on" .
Di sini kami menyalahgunakan penyeleksi jQuery dan acara menggelegak. Perhatikan bahwa saya memastikan saya membersihkan event handler setelahnya. Anda dapat mengotomatiskan perilaku ini dengan
$('.container').one
( lihat: docs ) tetapi karena kita perlu melakukan kondisi dalam handler yang tidak dapat diterapkan di sini.sumber
Contoh kode berikut tampaknya bekerja paling baik untuk saya. Meskipun Anda bisa menggunakan 'return false' yang menghentikan semua penanganan peristiwa itu untuk div atau turunannya. Jika Anda ingin memiliki kontrol pada div pop-up (formulir login pop-up misalnya), Anda perlu menggunakan event.stopPropogation ().
sumber
Terima kasih, Thomas. Saya baru mengenal JS dan saya telah mencari solusi untuk masalah saya. Salam membantu.
Saya telah menggunakan jquery untuk membuat kotak Login yang meluncur ke bawah. Untuk pengalaman pengguna terbaik, saya memutuskan untuk menghilangkan kotak ketika pengguna mengklik di suatu tempat kecuali kotak. Saya agak malu menggunakan sekitar empat jam untuk memperbaiki ini. Tapi, hei, saya baru mengenal JS.
Mungkin kode saya dapat membantu seseorang:
sumber
Yang juga bisa Anda lakukan adalah:
Jika target Anda bukan div maka sembunyikan div dengan memeriksa panjangnya sama dengan nol.
sumber
Saya melakukan yang di bawah ini. Berpikir untuk berbagi agar orang lain juga bisa mendapatkan keuntungan.
Beri tahu saya jika saya dapat membantu seseorang dalam hal ini.
sumber
div#newButtonDiv
tidak diklik. Saya akan merekomendasikan Anda menghapus yang kedua.click()
pada baris 4 (jika Anda melakukan ini, ingatlah untuk menghapus kurung kurawal, dan titik koma - baris 9).Coba ini:
sumber
Cara lain untuk menyembunyikan div kontainer saat klik terjadi di elemen bukan turunan;
sumber
Di sini #suggest_input in adalah nama kotak teks dan .suggest_container adalah nama kelas ul dan .suggest_div adalah elemen div utama untuk saran otomatis saya.
kode ini untuk menyembunyikan elemen div dengan mengklik di mana saja di layar. Sebelum melakukan semuanya, harap pahami kode dan salin ...
sumber
Coba ini, ini bekerja sempurna untuk saya.
sumber
tetapi Anda perlu mengingat hal-hal ini juga. http://css-tricks.com/dangers-stopping-event-propagation/
sumber
Berikut adalah solusi CSS / JS kecil yang berfungsi berdasarkan jawaban Sandeep Pal:
Cobalah dengan mengeklik kotak centang lalu di luar menu:
https://jsfiddle.net/qo90txr8/
sumber
Ini tidak berhasil - ini menyembunyikan .myDIV saat Anda mengeklik di dalamnya.
sumber
Hanya 2 perbaikan kecil untuk saran di atas:
hentikan propagasi pada peristiwa yang memicu ini, dengan asumsi itu klik
sumber
sumber
sumber
sumber
Solusi Sederhana: sembunyikan elemen pada acara klik di mana saja di luar beberapa elemen tertentu.
sumber