Saya ingin menampilkan dialog JQuery secara kondisional pada acara klik hyperlink.
Saya memiliki persyaratan seperti pada condition1 buka dialog JQuery dan jika condition1 tidak terpenuhi, navigasikan ke halaman seperti yang direferensikan oleh tag 'href' yang peristiwa kliknya dipertanyakan.
Saya dapat memanggil fungsi pada acara klik tautan. Fungsi ini sekarang memeriksa kondisi tersebut dengan menjalankan URL lain (yang mengeksekusi pengontrol Spring saya dan mengembalikan respons).
Semua bekerja sempurna hanya dengan window.open diblokir oleh pemblokir popup.
$('a[href*=/viewpage?number]').live('click', function(e) {
e.preventDefault();
redirectionURL = this.href;
pageId= getUrlVars(redirectionURL)["number"];
$.getJSON("redirect/" + pageId, {}, function(status) {
if (status == null) {
alert("Error in verifying the status.");
} else if(!status) {
$("#agreement").dialog("open");
} else {
window.open(redirectionURL);
}
});
});
Jika saya menghapus e.preventDefault();
dari kode, popoup blocker tidak memblokir halaman, namun untuk condition1 maka akan membuka dialog sekaligus membuka halaman 'href'.
Jika saya menyelesaikan satu masalah, itu menimbulkan masalah bagi orang lain. Saya tidak bisa memberikan keadilan pada kedua kondisi secara bersamaan.
Bisakah Anda membantu saya mengatasi masalah ini?
Setelah ini diselesaikan, saya memiliki masalah lain untuk dipecahkan yaitu navigasi pada acara OK dialog :)
Jawaban:
Pemblokir popup biasanya hanya akan mengizinkan
window.open
jika digunakan selama pemrosesan acara pengguna (seperti klik). Dalam kasus Anda, Anda meneleponwindow.open
nanti , bukan selama acara, karena$.getJSON
asinkron.Anda memiliki dua pilihan:
Lakukan sesuatu yang lain, daripada
window.open
.Buat panggilan ajax sinkron, yang biasanya Anda hindari seperti wabah karena mengunci UI browser.
$.getJSON
setara dengan:... dan agar Anda dapat membuat
$.getJSON
panggilan Anda sinkron dengan memetakan parameter Anda di atas dan menambahkanasync: false
:Sekali lagi, saya tidak menganjurkan panggilan ajax sinkron jika Anda dapat menemukan cara lain untuk mencapai tujuan Anda. Tetapi jika Anda tidak bisa, ini dia.
Berikut adalah contoh kode yang gagal dalam pengujian karena panggilan asinkron:
Contoh langsung | Sumber langsung(Tautan langsung tidak lagi berfungsi karena perubahan pada JSBin)Dan inilah contoh yang berhasil, menggunakan panggilan sinkron:
Contoh langsung | Sumber langsung(Tautan langsung tidak lagi berfungsi karena perubahan pada JSBin)sumber
Anda dapat memanggil window.open tanpa pemblokiran browser hanya jika pengguna melakukan beberapa tindakan secara langsung. Browser mengirimkan beberapa tanda dan menentukan bahwa jendela dibuka oleh tindakan pengguna.
Jadi, Anda bisa mencoba skenario ini:
sumber
myWindow.postMessage
) tetapi karena batasan Safaris untuk tidak menjalankan JavaScript di latar belakang, jendela induk tidak pernah dapat mengirim perubahan lokasi tersebut.Saya mengalami masalah ini dan saya tidak memiliki url saya sampai callback akan mengembalikan beberapa data. Solusinya adalah membuka jendela kosong sebelum memulai panggilan balik dan kemudian hanya mengatur lokasi saat panggilan balik kembali.
sumber
action().then(doWindowOpenThing).catch(doSomethingElseThatDoesntOpenAPopup)
Jadi saya tidak bisa membuka jendela sebelumnya (untuk menyimpan referensi, dll) jika nanti saya tidak akan menggunakannya, bukan?coba ini, ini berhasil untuk saya,
Apakah biola untuk http://jsfiddle.net/safeeronline/70kdacL4/1/ ini
sumber
Windows harus dibuat pada tumpukan yang sama (alias microtask ) dengan kejadian yang dimulai oleh pengguna, misalnya panggilan balik klik - sehingga tidak dapat dibuat nanti, secara asinkron.
Namun, Anda dapat membuat jendela tanpa URL dan kemudian Anda dapat mengubah URL jendela itu setelah Anda mengetahuinya , bahkan secara asinkron!
Browser modern akan membuka jendela dengan halaman kosong (sering disebut
about:blank
), dan dengan asumsi tugas asinkron Anda untuk mendapatkan URL cukup cepat, UX yang dihasilkan baik-baik saja. Jika Anda malah ingin merender pesan pemuatan (atau apa pun) ke jendela saat pengguna menunggu, Anda bisa menggunakan URI Data .sumber
Kode ini membantu saya. Semoga ini membantu beberapa orang
sumber
Coba gunakan elemen tautan dan klik dengan javascriipt
dan naskahnya
Gunakan seperti ini
sumber
Pengamatan bahwa acara harus dimulai oleh pengguna membantu saya untuk mengetahui bagian pertama dari ini, tetapi bahkan setelah itu Chrome dan Firefox masih memblokir jendela baru. Bagian kedua menambahkan target = "_ blank" ke tautan, yang disebutkan dalam satu komentar.
Singkatnya: Anda perlu memanggil window.open dari peristiwa yang dimulai oleh pengguna, dalam hal ini mengklik link, dan link tersebut harus memiliki target = "_ blank".
Pada contoh di bawah, tautannya menggunakan class = "button-twitter".
sumber
ini berhasil untuk saya.
sumber
Saya menggunakan metode ini untuk menghindari pemblokir popup di kode React saya. itu akan bekerja di semua kode javascript lainnya juga.
Saat Anda membuat panggilan asinkron pada peristiwa klik, cukup buka jendela kosong terlebih dahulu dan kemudian tulis URL di dalamnya nanti saat panggilan asinkron akan selesai.
jika panggilan async berhasil, tulis kalimat berikut
sumber