karena kita akan menggunakan browser sebagai lingkungan pengujian kode, mari kita lihat beberapa fungsi untuk berinteraksi dengan pengguna. alert, prompt dan confirm
Untuk yang satu ini kita sudah melihatnya. Ini akan menampilkan pesan dan menunggu pengguna menekan tombol "OK".
Contoh
alert("Hello");
Jendela mini dengan pesan ini disebut jendela modal. Kata "modal" berarti pengunjung tidak dapat berinteraksi dengan apa pun di halaman, menekan tombol lain, dll. sampai mereka selesai berurusan dengan jendela ini. Dalam hal ini – sampai mereka menekan “OK”
Fungsi prompt menerima dua argumen
result = prompt(title, [default]);_
Ini menampilkan jendela modal dengan pesan teks, kolom input untuk pengunjung, dan tombol OK/CANCEL
result = prompt(title, [default]);1Teks yang akan ditampilkan kepada pengunjung. result = prompt(title, [default]);2 Parameter kedua adalah opsional, nilai awal untuk kolom inputKurung dalam sintaks result = prompt(title, [default]);_3
Tanda kurung siku pada sintaks result = prompt(title, [default]);_2 pada kode sintaks di atas menunjukkan bahwa parameter bersifat opsional, tidak terlalu dibutuhkan
Pengunjung halaman dapat mengetikkan sesuatu di kotak prompt dan menekan tombol OK. Kemudian kita akan mendapatkan teks di result = prompt(title, [default]);5. Atau pengunjung halaman dapat membatalkan kotak prompt dengan menekan Cancel atau menekan Esc pada keyboard, maka kita akan mendapatkan result = prompt(title, [default]);6 sebagai result = prompt(title, [default]);5
Panggilan ke prompt mengembalikan teks dari kolom input atau result = prompt(title, [default]);6 jika input dibatalkan
Sebagai contoh
let age = prompt('Berapakah umut anda?', 100); alert(`Umur Anda ${age} tahun`); // Umur Anda 100 tahun!
Di IE. selalu isi nilai result = prompt(title, [default]);_2
Parameter kedua ini opsional, tetapi jika kami tidak menyediakannya, Internet Explorer akan memasukkan teks let age = prompt('Berapakah umut anda?', 100); alert(`Umur Anda ${age} tahun`); // Umur Anda 100 tahun!1 ke prompt
Jalankan kode ini di Internet Explorer untuk melihatnya
let test = prompt("Test");
Jadi, agar prompt terlihat bagus di IE, sebaiknya berikan argumen kedua
let test = prompt("Test", ''); // <-- for IE
Sintaks
result = confirm(question);
Fungsi confirm menampilkan jendela modal dengan let age = prompt('Berapakah umut anda?', 100); alert(`Umur Anda ${age} tahun`); // Umur Anda 100 tahun!3 dan dua tombol. OK dan Batal
Hasilnya adalah let age = prompt('Berapakah umut anda?', 100); alert(`Umur Anda ${age} tahun`); // Umur Anda 100 tahun!_4 jika OK ditekan dan let age = prompt('Berapakah umut anda?', 100); alert(`Umur Anda ${age} tahun`); // Umur Anda 100 tahun!5 jika tidak
Sebagai contoh
let isBoss = confirm("Are you the boss?"); alert( isBoss ); // true jika OK ditekan
Kami membahas 3 fungsi khusus browser untuk berinteraksi dengan pengunjung
alert_menampilkan pesan. promptmenampilkan pesan yang meminta input teks pengguna. Mengembalikan teks atau, jika Cancel atau Esc diklik, result = prompt(title, [default]);6. confirm_menampilkan pesan dan menunggu pengguna menekan "OK" atau "Cancel". Ini mengembalikan let age = prompt('Berapakah umut anda?', 100); alert(`Umur Anda ${age} tahun`); // Umur Anda 100 tahun!_4 untuk OK dan let age = prompt('Berapakah umut anda?', 100); alert(`Umur Anda ${age} tahun`); // Umur Anda 100 tahun!5 untuk Batal/EscSemua metode ini adalah modal. mereka mengganggu eksekusi skrip dan tidak mengizinkan pengunjung berinteraksi dengan apa pun di halaman hingga jendela ditutup
Ada dua batasan yang dimiliki oleh semua metode di atas
- Lokasi yang tepat dari jendela modal ditentukan oleh browser. Biasanya, di tengah
- Tampilan jendela yang tepat juga bergantung pada browser. Kami tidak dapat memodifikasi ini
Itulah harga untuk kesederhanaan. Ada banyak cara untuk menyajikan jendela lebih manis dan kaya interaksi dengan pengguna, tetapi jika "lonceng dan peluit" tidak menjadi masalah, metode ini baik-baik saja