Baru-baru ini, ketika saya sedang mengerjakan sebuah proyek, saya menghadapi situasi di mana penggunaan window.open dicegat oleh browser, yang membuat orang sangat tertekan. Meskipun halaman tersebut dapat dirilis di lingkungannya sendiri, bagi pengguna, pengguna tidak bisa diperlukan untuk melewati intersepsi. Terlebih lagi, ketika intersepsi terjadi, banyak pemula yang tidak tahu apa yang terjadi dan tidak tahu ke mana harus melihat halaman yang disadap tersebut.
Selain itu, dapat ditemukan bahwa ketika window.open memicu suatu peristiwa untuk pengguna atau dimuat, itu tidak akan dicegat. Setelah kode pop-up dipindahkan ke ajax atau sepotong kode asinkron, kode tersebut akan segera dicegat .
Analisis penyebab & penelitian mendalamKetika browser mendeteksi jendela pop-up baru yang dihasilkan oleh operasi non-pengguna, browser akan memblokirnya. Karena browser menganggap ini bukan halaman yang ingin dilihat pengguna.
Misalnya jika dieksekusi langsung di js maka kodenya sebagai berikut:
kode js:
//Buka halaman secara langsung window.open('//www.baidu.com', '_blank');Peramban ie8 chrome 40 firefox 34 opera 27 safari 5.1.7
Apakah akan mencegah NNYYY muncul dan untuk kode berikut:
kode js:
document.body.addEventListener('klik', function() { window.open('//www.baidu.com', '_blank'); });Semua browser tidak akan memblokirnya.
Singkatnya, setiap browser memiliki penilaian berbeda mengenai waktu intersepsi, dan respons terhadap kode yang ditempatkan di callback ajax juga berbeda, jadi saya tidak akan membahas detailnya di sini. Namun, pemrogram tidak ingin jendela pop-up dalam kode kita disadap oleh browser.
Larutan:1. Gunakan tag sebagai gantinya
Dengan adanya fungsi berikut, mengikat fungsi ini ke callback peristiwa klik dapat menghindari intersepsi jendela pop-up oleh sebagian besar browser:
kode js:
fungsi newWin(url, id) { var a = document.createElement('a'); a.setAttribute('href', url); a.setAttribute('target', '_blank'); ', id); // Mencegah penambahan berulang if(!document.getElementById(id)) document.body.appendChild(a);2. Gunakan metode kirim formulir untuk membuka halaman
Metode ini memerlukan pembuatan dari, lalu memicu pengiriman formulir dengan kode js, dan mengirimkan formulir ke halaman baru. Kodenya panjang, jadi saya tidak akan menulisnya di sini larutan.
Perlu diperhatikan bahwa kedua metode di atas tidak cocok untuk ditempatkan pada fungsi callback ajax. Jika ditempatkan pada fungsi callback, keduanya akan tetap dicegat oleh browser.
3. Solusi utama - munculkan jendela terlebih dahulu, lalu arahkan ulang
Solusi ketiga sebenarnya adalah solusinya. Ide intinya adalah: pertama buka halaman melalui klik pengguna, lalu arahkan ulang halaman tersebut. Contoh kodenya adalah sebagai berikut.
kode js:
xx.addEventListener('click', function () { // Buka halaman, yang terbaik adalah menggunakan halaman prompt di sini var newWin = window.open('loading page'); ajax().done(function() { // Ulangi Langsung ke halaman target newWin.location.href = 'url target'; } });Cara di atas sebenarnya membuka dua alamat, jadi disarankan agar Anda memberikan pesan seperti 'Halaman saat ini sedang dimuat, harap tunggu' saat membuka alamat pertama. . halaman prompt sederhana, yang dapat menghindari pembukaan halaman target sebenarnya dua kali dan membiarkan pengguna memperhatikan pengalihan halaman.
Solusi kedua:
<a href=javascript:; onclick=dialog();>Klik jendela pop-up</a><script>fungsi dialog(){ $.ajax({ url: 'url', ketik: 'POST', tipe data: 'json ', async: false, // Ini harus didefinisikan sebagai data sinkron: {param1: 'value1'}, sukses: function(data){ window.open(data.url, '_blank'); //Memulai a jendela munculan} })} </skrip>Kerugian dari metode ini:
Pengujian sebenarnya dapat menyelesaikan masalah intersepsi di sebagian besar browser, tetapi tidak dapat menyelesaikan intersepsi perangkat lunak keamanan (360 tidak akan mencegat, tetapi QQ Butler akan melakukannya)
Di atas adalah keseluruhan isi artikel ini, saya harap dapat bermanfaat untuk pembelajaran semua orang. Saya juga berharap semua orang mendukung VeVb Wulin Network.