Oleh Ezil Dilihat : 214 22 Januari 2020

Mengenal Alert, Prompt dan Confirm pada javascript

Alert, prompt dan confirm pada javascript merupakan fungsi yang selalu digunakan tergantung kebutuhan, setiap fungsi tersebut berbeda pula cara penggunaanya. untuk lebih memahami, kita akan jabarkan masing-masing tersebut beserta dengan contoh kodenya

Mengenal Alert, Prompt dan Confrim pada Javascript

1.Alert

Dari katanya saja kita sudah tahu bahwa alert adalah pemberitahuan, yang berarti memberitahukan atau menyampaikan pesan kepada pengguna atas sesuatu tindakan yang telah dilakukan oleh pengguna website sebelumnya. Bisa berupa data yang berhasil atau gagal disimpan, form yang harus komplit diisi dan banyak lainnya.

Mari kita contohkan cara pembuatan alert pada HTML+Javascript

Contoh 1 :

<!doctype html>
<html>
   <head>
      <script type="text/javascript">
          function contohAlert(){
             alert("Ini adalah contoh alert");
          }
      </script>
   </head>
   <body>
      <h2>Cara memanggil fungsi alert</h2>
      <button onclick="contohAlert()">Tes Alert</button>
   </body>
</html>

Contoh 2 memanggil fungsi alert langsung dari event onclick pada sebuah tag <button>

<!doctype html>
<html>
   <head>
       <title>Belajar Alert</title>
   </head>
   <body>
      <h2>Cara memanggil fungsi alert</h2>
      <button onclick="alert('Ini adalah contoh')">Tes Alert</button>
   </body>
</html>

Jika kita jalankan kode html berikut, maka akan memunculkan tampilan seperti berikut

wikitapad_cara_memanggil_fungsi_alert_pada_javascript.JPGwikitapad_cara_menggunakan_fungsi_alert.JPG

2.Confirm

Fungsi confirm merupakan fungsi yang digunakan untuk mengonfirmasi sebuah tindakan yang akan dilakukan. seperti penghapusan data, penyimpanan data yang memerlukan konfirmasi sebelum dilanjutkan. untuk lebih jelasnya, dapat kita contohkan seperti berikut

<!doctype html>
<html>
   <head>
      <script type="text/javascript">
          function contohKonfirm(){
             var konfirmasi=confirm("Lihat pesan selanjutnya?");
             if(konfirmasi==true){
                 alert('Selamat belajar confirm()');
             }
          }
      </script>
   </head>
   <body>
      <h2>Cara memanggil fungsi confirm</h2>
      <button onclick="contohKonfirm()">Tes Konfirmasi</button>
   </body>
</html>

Nah silahkan anda copy ke sebuah notepad dan buat ekstensi nya .html. contoh : belajar.html agar anda bisa langsung mencoba cara menggunakannya

3.Prompt

Fungsi prompt merupakan sebuah fungsi yang dapat diisi dengan sebuah nilai sehingga nilai tersebut dapat kita kirim ke server atau sebagai bahan form tambahan. untuk contoh prompt, kita akan membuat sebuah perkalian sederhana. berikut contohnya

<!doctype html>
<html>
   <head>
      <script type="text/javascript">
          function contohPrompt(){
             var n1=prompt("Input nilai pertama");
             var n2=prompt("Input nilai kedua");
             
             var hasil=parseFloat(n1)*parseFloat(n2);
             alert('Hasil perkalian '+n1+'X'+n2+'='+hasil);
          }
      </script>
   </head>
   <body>
      <h2>Cara memanggil fungsi prompt</h2>
      <button onclick="contohPrompt()">Tes Prompt</button>
   </body>
</html>

Setelah kita bahas mengenai alert, prompt dan confirm pada javascript, perlahan-lahan anda dapat memahami bahasa pemrograman javascript berbasis client side. Demikianlah artikel mengenal alert, prompt dan confirm pada javascript. Silahkan tinggalkan komentar anda. Sekian dan terima kasih

Bagikan!!! Tulisan ini jika bermanfaat share artikel ke facebook share artikel ke twitter share artikel ke pinterest share artikel ke linkedin
    Belum ada komentar untuk artikel iniJadilah yang pertama mengomentari artikel ini
Pendidikan & Tutorial

Pendidikan & Tutorial

Web Develop

Artikel Web Develop
Portal Berita
  1. Instagram Dukung UMKM Atasi Dampak Pandemi Covid-19 - Selular.ID
  2. Gara-gara Iqbaal Ramadhan, Fajar Bustomi Sempat Diprotes Penggemar Dilan - Kompas.com - KOMPAS.com
  3. Tyson Fury Terancam Dihukum 8 Tahun Penjara karena Berbohong - CNN Indonesia
  4. Awas, Virus Corona Sangat Mudah Sekali Menyebar di Toko Baju - Grid.ID
  5. Link Live Streaming Southampton Vs Arsenal - detikSport
  6. Kajian Ilmiah: Tikus yang Dijual di Pasar Asia Tenggara Mengandung Corona - Detiknews
  7. Suzuki Adakan Program Trade-in, Mobil Lama Ditukar, Diganti Ertiga Sampai XL7 Baru - GridOto.com
  8. Pencegahan Virus Corona, Barack Obama dan Perlu Tidaknya Penggunaan Masker... - Kompas.com - KOMPAS.com
  9. Protein dari Tanaman Lebih Sehat daripada Daging, Bisa Kurangi Risiko Kanker - Bisnis.com
  10. Jika Tumbalkan Marcus Rashford, Manchester United Bisa Lunasi Klausul Jadon Sancho - Bolasport.com
  11. Harga Emas Merosot 30 Dollar AS, Apa Sebabnya? - Kompas.com - KOMPAS.com
  12. Foto: Lebih Dekat dengan si Cantik Gebetan Baru Xherdan Shaqiri - detikSport
  13. Apakah Virus Corona Menyebar Melalui Makanan? - Bisnis.com
  14. Hasil Kualifikasi Moto2 Qatar 2020 - Adik Valentino Rossi Nyaris Pole Position, Andi Gilang Ungguli Juara Dunia Moto3 - Bolasport.com
  15. Thiago Alcantara Bukan yang Terbaik untuk Liverpool - detikSport
  16. Menyemprot Disinfektan di Area Outdoor, Adakah Efek Sampingnya? - Suara.com
  17. Cerita dokter Spanyol dan Italia yang terpaksa memilih pasien muda untuk diselamatkan - Kontan
  18. Update 10 Pemain Paling Bernilai di Dunia, Tak Ada Messi dan Ronaldo - Bolasport.com
  19. Google Meet dalam waktu dekat bisa diakses langsung di Gmail - ANTARA Sumatera Selatan
  20. Yellow Wall di Signal Iduna Park Bikin Haaland Merinding - detikSport