Pengendalian pepijat apabila easyui rangka kerja hadapan jQuery menggunakan Dialog_jquery

Saya telah menggunakan rangka kerja bahagian hadapan easyui untuk membangunkan dan mereka bentuk UI baru-baru ini, tetapi apabila menggunakan Dialog, saya mendapati bahawa jika terdapat banyak kandungan halaman, masalah akan berlaku Pertama, lihat kod asal saya :

Salin kod Kod adalah seperti berikut: Sila pilih untuk mengesahkan keputusan:

Success Gagal $("#confirmd").dialog({ Tajuk: 'Pengesahan tempahan', iconCls: 'ikon-simpan', boleh diubah saiz: palsu, modal: benar, ditutup: benar, lebar: 200, tinggi: 200, butang: [{ teks: 'Serah', pengendali: fungsi () { makluman("ok"); } }, { teks: 'Batal', pengendali: fungsi () { $("#confirmd").dialog("close"); } }] }); Fungsi openconfirmDlg() { $("#confirmd").dialog("open"); }

Apabila butang [Sahkan Pelantikan] diklik, kotak dialog terbuka dengan kesan berikut:

Anda boleh melihat beberapa masalah Salah satunya ialah lapisan topeng tidak menutup kandungan halaman web sepenuhnya bahagian atas halaman. Anda perlu menyeret bar skrol ke belakang Ia boleh dilihat pada akhir item bahawa sebab untuk ini adalah sangat jelas ketinggian tetingkap (iaitu, ketinggian visual) diperolehi, topeng tidak lengkap Kedua, kedudukannya tidak betul membuat penambahbaikan yang sepadan untuk menyelesaikan masalah berikut ialah kod yang dipertingkatkan:

Salin kod Kod adalah seperti berikut: Sila pilih untuk mengesahkan keputusan:

Success Gagal $("#confirmd").dialog({ Tajuk: 'Pengesahan tempahan', iconCls: 'ikon-simpan', boleh diubah saiz: palsu, modal: benar, ditutup: benar, lebar: 200, tinggi: 200, butang: [{ teks: 'Serah', pengendali: fungsi () { makluman("ok"); } }, { teks: 'Batal', pengendali: fungsi () { $("#confirmd").dialog("close"); } }] }); Tetingkap.onscroll = fungsi () { $("#confirmd").dialog("move", { atas: $(document).scrollTop() ($(window).height() - 200) * 0.5 }); } Fungsi openconfirmDlg() { $("#confirmd").dialog("open"); $("#confirmd").dialog("move", { atas: $(document).scrollTop() ($(window).height() - 200) * 0.5 }); $(".window-mask").css({ height: $(document).height()}); }

Sekarang adalah perkara biasa untuk membuka kotak dialog, kesannya adalah seperti berikut: Anda sentiasa boleh berada di tengah-tengah halaman web walaupun anda menatal Kesannya adalah seperti berikut:

Kod utama untuk memastikan kesan di atas ialah:

Salin kod Kod adalah seperti berikut: $("#confirmd").dialog("move", { top: $(document).scrollTop() ($(window).height() - 200) * 0.5 }); //Alih ke halaman kandungan semasa tengah $(".window-mask").css({ height: $(document).height()}); //Laraskan ketinggian lapisan topeng kepada ketinggian kandungan halaman web

Mari kita uji dan lihat sama ada ia lebih mudah digunakan berbanding sebelum ini. Saya telah mengujinya pada kebanyakan penyemak imbas dan tiada masalah, sila tinggalkan mesej dan beritahu saya untuk dikemas kini.