Bagaimana untuk mengeluarkan kotak gesaan dalam jquery-Soal Jawab bahagian hadapan-php.cn

Bagaimana untuk mengeluarkan kotak gesaan dalam jquery

WBOY

Lepaskan： 2023-05-25 12:54:09

asal

616 orang telah melayarinya

Apabila membangunkan tapak web, aplikasi web atau aplikasi mudah alih, kita selalunya perlu memperkenalkan atau menggunakan perpustakaan jQuery. Satu aplikasi biasa adalah untuk mengeluarkan petua alat. Dengan mengeluarkan kotak gesaan, kami boleh membuat pengguna lebih jelas mengetahui status interaksi atau operasi tertentu. Artikel ini akan memperkenalkan cara menggunakan jQuery untuk mengeluarkan kotak gesaan.

Pertama, kita perlu memperkenalkan fail perpustakaan jQuery ke dalam projek. Ini boleh diperkenalkan dengan memuat turun fail jQuery dan meletakkannya ke dalam projek anda, atau menggunakan CDN (Rangkaian Penghantaran Kandungan). Dalam fail HTML, kita boleh menggunakan kod berikut:

<head>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <script src="yourScript.js"></script>
</head>

Salin selepas log masuk

di mana https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js ialah alamat CDN jQuery dan yourScript.js ialah nama fail yang mengandungi kod JavaScript anda.

Setelah kami berjaya memperkenalkan perpustakaan jQuery, kami boleh mula menggunakan fungsi petua alat yang disediakannya.

Kotak gesaan timbul (Makluman)

Kotak gesaan amaran ialah salah satu jenis kotak gesaan yang paling mudah. Ia dicetuskan apabila pengguna mengklik butang atau pautan untuk muncul kotak dialog yang mengandungi kandungan teks yang ditentukan. Mengeluarkan kotak gesaan Makluman boleh dicapai dengan kod berikut:

$(document).ready(function(){
  alert("Hello World!");
});

Salin selepas log masuk

Dalam kod ini, selepas dokumen HTML dimuatkan, fungsi yang dilaksanakan alert("Hello World!"); akan muncul kotak gesaan yang mengandungi teks Hello World!.

Sahkan kotak gesaan (Sahkan)

Sahkan kotak gesaan ialah kaedah interaksi biasa, digunakan untuk mengingatkan pengguna untuk mengesahkan apabila melakukan operasi penting. Kotak gesaan pengesahan akan muncul dua butang, biasanya satu ialah butang "Sahkan" dan satu lagi ialah butang "Batal". Mengeluarkan kotak gesaan Sahkan boleh dicapai dengan menggunakan kod berikut:

$(document).ready(function(){
  let result = confirm("你确定要删除当前这个文件吗？");
  if (result) {
    // 用户点击了确认按钮后执行的代码
  }
  else {
    // 用户点击了取消按钮后执行的代码
  }
});

Salin selepas log masuk

Dalam kod ini, sistem akan muncul kotak gesaan bertanya kepada pengguna jika mereka mahu melakukan operasi tertentu. let result = confirm("你确定要删除当前这个文件吗？"); Kod ini akan mengeluarkan kotak gesaan yang mengandungi teks "Adakah anda pasti mahu memadamkan fail semasa dan dua butang "Sahkan" dan "Batal". Apabila pengguna mengklik salah satu butang, fungsi mengembalikan nilai Boolean yang menunjukkan sama ada pengguna mengklik butang "Sahkan" atau "Batal".

Kotak gesaan input (Prompt)

Kotak gesaan Prompt ialah kaedah interaktif yang membolehkan pengguna memasukkan teks Ia biasanya digunakan untuk meminta maklumat tambahan daripada pengguna atau memasukkan data tertentu. Kotak gesaan akan mengandungi kotak input dan sahkan dan batalkan butang. Mengeluarkan kotak gesaan Prompt boleh dicapai dengan menggunakan kod berikut:

$(document).ready(function(){
  let name = prompt("请输入你的名字：");
  if (name != null && name != "") {
    alert("欢迎你，" + name + "！");
  }
});

Salin selepas log masuk

Kod ini akan mengeluarkan kotak gesaan yang mengandungi kotak input, butang pengesahan dan butang batal Gesaan ialah "Sila masukkan nama anda: ". Apabila pengguna menekan butang sahkan, kami akan mengeluarkan mesej alu-aluan berdasarkan teks yang dimasukkan oleh pengguna.

Dalam artikel ini, kami memperkenalkan kaedah mengeluarkan kotak gesaan pop timbul, kotak gesaan pengesahan dan kotak gesaan input dalam jQuery. Mereka boleh membantu kami meningkatkan pengalaman pengguna dan meningkatkan interaktiviti pengguna dalam aplikasi web. Ingatlah untuk menguji dan mengesahkan fungsi dan kesan setiap kotak gesaan dengan teliti semasa proses pembangunan untuk memastikan ia boleh berfungsi dengan betul dan memberi perkhidmatan yang lebih baik kepada pengguna kami.

Atas ialah kandungan terperinci Bagaimana untuk mengeluarkan kotak gesaan dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!