Cara menggunakan javascript pop

Halo teman-teman, kali ini saya akan membagikan tutorial membuat pop-up alert menggunakan SweetAlert

Pop-up alert sendiri merupakan hal yang sering dilakukan dalam sebuah website. Alert digunakan untuk menampilkan pesan atau peringatan kepada pengguna dengan jendela dialog

Lansiran dapat dibuat menggunakan fungsi alert() dalam JavaScript. Namun tampilan yang dihasilkan dengan fungsi bawaan terkesan sederhana dan kaku sehingga perlu menggunakan library JavaScript tambahan untuk dapat membuat pop-up alert yang lebih menarik dan dapat didesain sesuai dengan keinginan kita. Salah satu pustaka JavaScript itu adalah SweetAlert

Cara menggunakan javascript pop
SweetAlert adalah library JavaScript yang menyediakan berbagai pilihan bagi kita untuk membuat berbagai jenis pop-up alert seperti regular alert, error alert, success alert, konfirmasi alert, dan sebagainya.

Menulis kode SweetAlert sesingkat menulisnya menggunakan fungsi bawaan JavaScript. Hal ini membuat SweetAlert banyak diminati oleh web developer dalam membuat pop-up alert di website mereka

Langkah-langkah Menggunakan SweetAlert

Berikut adalah langkah-langkah dalam membuat pop-up alert menggunakan SweetAlert

  1. Kunjungi halaman SweetAlert menggunakan browser Anda masing-masing. Silakan klik tautan berikut untuk mengunjungi situs web SweetAlert. https. //peringatan manis. js. org/
  2. Langkah kedua adalah menginstal SweetAlert dengan menambahkan kode berikut ke file website kita. Kodenya adalah
  3. Setelah menambahkan kode, kita bisa langsung menggunakan beberapa contoh pop-up alert yang tersedia di library SweetAlert

Contoh Lansiran Munculan SweetAlert

Berikut adalah contoh penggunaan SweetAlert pada tampilan halaman website. Silahkan copy kode dibawah ini untuk melihat hasilnya







    

    

    

    

    

    Contoh Penggunaan SweetAlert





    

Contoh Pop-up Alert Menggunakan SweetAlert Klik disini

Hasil

Hasil kode dapat dilihat pada gambar di bawah ini

Cara menggunakan javascript pop

Baca Juga. Apa Situs Web Pertama di Dunia?

Penjelasan

  1. Saat kita menekan tombol "Klik di sini", fungsi example() pada kode berikut akan dijalankan. Kodenya adalah. Klik disini
  2. Pada contoh function() terdapat kode perintah swal yang merupakan perintah dari library SweetAlert. Di dalam kode swal ada beberapa kode lain yang bisa kita ubah sesuai kebutuhan. Kode judul adalah kode untuk judul pada peringatan pop-up, kode teks adalah kode untuk menampilkan teks pada peringatan pop-up, kode ikon untuk mengubah simbol, dan kode tombol untuk mengatur tombol di peringatan pop-up. Selain kode tersebut, masih banyak kode lain yang bisa kita coba untuk membuat pop-up alert sesuai dengan kebutuhan kita. Contoh function() dapat dilihat pada kode berikut.  
function contoh() {

            swal({

                title: "Berhasil!",

                text: "Pop-up berhasil ditampilkan",

                icon: "success",

                button: true

            });

        }
_

Ini adalah artikel tentang cara membuat pop-up alert menggunakan SweetAlert di halaman website. Semoga artikel yang saya tulis dapat bermanfaat bagi para pembaca. Penulis menyadari bahwa artikel ini masih jauh dari sempurna. Oleh karena itu, jika ada informasi atau kata-kata yang tidak berkenan bagi saya, saya mohon maaf. Sekian artikel dari saya, terima kasih. Tetap semangat dan jangan menyerah dalam bekerja

Kali ini kita masih akan membahas metode yang tersedia pada array di JavaScript. Sekarang kita akan mencoba mempelajari metode pop()

pop() adalah metode yang digunakan untuk menghapus array terakhir

Skrip dasarnya adalah sebagai berikut

namavariabelnya = array1.pop();

Contoh penggunaannya adalah sebagai berikut

Method Array join()

Hasilnya akan seperti ini

Metode Array bergabung()

Terlihat, pada drink array, ketika minuman.pop() dieksekusi, dia akan mengambil array terakhir (Cendol). Dan ketika menjalankan drink array lagi, Cendol sudah tidak ada, dan jika minuman.pop() dipanggil kembali, dia akan menghapus array terakhir yaitu Cincau. Dan seterusnya

Tahukah Anda bahwa JavaScript memiliki tiga jenis jendela pop-up? . Munculan JavaScript, salah satunya adalah jendela dialog atau fungsi alert(). Lansiran JavaScript ini memberikan informasi yang relevan kepada pengguna atau data yang perlu dikonfirmasi

Penambahan lansiran JavaScript ini menjadikan situs web lebih dinamis dan informatif. Artikel ini akan membahas pop up JavaScript dan cara membuatnya. Jika Anda tertarik untuk mengetahui pastikan Anda membaca artikel ini sampai akhir

Daftar isi

Munculan JavaScript dan Lansiran JavaScript

Seperti yang telah disebutkan sebelumnya, ada tiga jenis JavaScript Pop Up, yaitu. Peringatan, Konfirmasi, dan Prompt. Untuk menulis banyak baris di jendela sembulan JavaScript, Anda harus menggunakan string "\n". Anda tidak perlu menggunakan awalan jendela saat menulis metode kotak pop-up

Fungsi alert() JavaScript digunakan untuk menampilkan kotak peringatan virtual yang tersedia di JavaScript. Ini sebagian besar digunakan untuk memberikan pesan peringatan kepada pengguna. Fungsi ini menampilkan kotak dialog peringatan yang terdiri dari beberapa pesan tertentu (yang bersifat opsional) dan tombol OK. Ketika kotak dialog muncul, kita harus mengklik "OK" untuk melanjutkan

Kotak dialog peringatan mengambil fokus dan memaksa pengguna untuk membaca pesan yang ditentukan. Jadi, kita harus menghindari penggunaan metode ini secara berlebihan karena akan menghentikan pengguna mengakses bagian lain dari halaman web hingga kotak tertutup

Dapat dipahami bahwa penggunaan metode alert menggunakan contoh. Misalkan kita harus mengisi formulir untuk kartu identitas. Ini menanyakan tentang tanggal lahir untuk kriteria kelayakan kartu identitas. Jika usianya sudah 18 tahun ke atas, maka proses akan dilanjutkan. Jika tidak, maka akan muncul pesan peringatan bahwa usia di bawah 18 tahun. Pesan peringatan ini adalah 'Peringatan kotak'

Contoh lain adalah misalkan pengguna diharuskan mengisi formulir di mana beberapa bidang diperlukan untuk memasukkan beberapa teks, tetapi pengguna lupa memberikan input. Sebagai bagian dari validasi, kita dapat menggunakan kotak dialog peringatan untuk menampilkan pesan peringatan terkait pengisian kolom teks

Alih-alih menampilkan peringatan atau kesalahan, kotak dialog peringatan dapat digunakan untuk pesan biasa seperti 'selamat datang kembali', 'Halo XYZ', dll.

Artikel Terkait   Tutorial JavaScript 32. Javascript Reserved Word, Pahami Penggunaannya.

Kotak Peringatan di JavaScript

Cara menggunakan javascript pop

Peringatan kotak JavaScript digunakan saat Anda memerlukan beberapa informasi untuk menjangkau pengguna. Saat kotak peringatan ini muncul, pengguna perlu menekan tombol OK untuk melanjutkan aktivitas

Namun hal ini juga dapat mengganggu aktivitas pengguna, sehingga Anda harus berhati-hati saat menggunakannya. Anda dapat menulis kode berikut untuk menampilkan kotak peringatan JavaScript sebagai berikut

window.alert("Teks Alert akan muncul");
_

Awalan 'jendela' adalah opsional. Anda masih dapat menulis kode tanpa awalan

alert("Teks Alert akan muncul");

Contoh di atas membuat peringatan JavaScript munculan yang berisi dua baris teks

alert("Halo\nApa Kabar ?");
_

Kotak Konfirmasi dalam JavaScript

Munculan konfirmasi dalam JavaScript digunakan saat Anda membutuhkan pengguna untuk menerima sesuatu. Saat kotak pop-up ini dikonfirmasi dan dibuka, pengguna harus mengklik salah satu dari dua tombol (OK atau CANCEL) untuk menutup kotak tersebut. OK mengembalikan true, sedangkan CANCEL mengembalikan false. Anda dapat menulis kode dengan mengikuti kode di bawah ini untuk menampilkan kotak konfirmasi

window.confirm("Apakah Anda Setuju ? Tekan OK untuk Melanjutkan");

Awalan 'jendela' adalah opsional. Anda masih dapat menulis kode tanpa awalan

confirm("Apakah Anda Setuju ? Tekan OK untuk Melanjutkan");
_

Kotak konfirmasi mengembalikan 'benar' jika Tombol diklik dan mengembalikan salah jika BATAL ditekan

var r = confirm("Tekan Ok Untuk Melanjutkan");
if (r == true) { 
   x = "Tombol OK telah ditekan";  
}  
else {
   x = "Tombol Cancel telah ditekan";  
}
_

Kotak Prompt di JavaScript

Kotak prompt digunakan saat Anda membutuhkan pengguna untuk memasukkan beberapa informasi sebelum melanjutkan. Untuk mematikan kotak prompt, pengguna harus mengklik tombol OK atau CANCEL

Kotak konfirmasi mengembalikan data input jika tombol OK diklik. Ini mengembalikan nol jika tombol CANCEL diklik. Anda dapat menulis kode berikut untuk menampilkan kotak prompt

window.prompt("Halo Siapa Namamu ?","Dani");

Sama seperti fungsi pop up sebelumnya, awalan 'jendela' bersifat opsional. Anda masih dapat menulis kode tanpa awalan

prompt("Halo Siapa Namamu ?","Dani");

Anda dapat melihat contoh berikut untuk mendapatkan ide yang jelas dan klik 'Coba Langsung. ' dan lihat cara kerjanya

function firstFunction() {
    var txt;
    var person = prompt("Masukkan Nama Lengkap", "Dani Aditya");
    if (person  == null || person  == "") {
        txt = "User telah membatalkan perintah.";
    } else {
        txt = "Halo " + person + "! Apa Kabar?"
    }
    document.getElementById("test").innerHTML = txt;
}

Artikel Terkait   Tutorial JavaScript 10. Komentar dalam Javascript dan Cara Membuatnya

Itulah penjelasan pop up di JavaScript. Beberapa hal yang perlu diperhatikan mengenai pop up di JavaScript adalah

Apa fungsi metode pop() dalam array?

Metode pop() adalah kebalikan dari push () , ini menghapus elemen terakhir dari a < /a> array dan mengembalikan elemen yang dihapus.

Apa fungsi push dalam JavaScript?

push ( nilai_some ). adalah fungsi yang digunakan untuk memasukkan nilai ke dalam array dan disimpan di paling akhir/kanan.

Apa perbedaan antara push dan pop dalam operasi stack?

Push Merupakan operator yang berfungsi untuk menambahkan elemen ke dalam stack dan tidak dapat dilakukan jika < /a> tumpukan keadaan penuh. Pop Merupakan operator yang berfungsi untuk menghilangkan elemen teratas dari dalam stack dengan kondisi tumpukan bukan dalam kondisi kosong.

Apa itu Metode di JS?

Metodemetode digunakan untuk manipulasi array, seperti menambahkan item baru, menghapus, dan segera.