Cara Membuat Kotak Username Dan Password Sederhana Menggunakan JavaScript Pemrograman Web

Assalamu?Alaikum..

Masih Pada pembahasan Laboratorium Informatika, kali ini Praktikum Pemrograman Web ke 2 saya ingin sharing tentang Cara Membuat Kotak Username Dan Password Menggunakan Java Script. Bahannya masih sama yaitu Notepad++. Oke langsung saja ya disimak :

1. Buka Notepad++ dengan cara : tekan (Windows+r) – ketik notepad++ , lalu ketikkan atau copy paste script dibawah ini :

<html>

<head>

<script type="text/javascript">

function salam()

alert("Assalamu'alaikum Brada!!");

feature spoiler()

document.GetElementById("nama").InnerHTML="Muhammad Faris Al Fatih";

function npm()

document.GetElementById("npm").InnerHTML="54411827";

</script>

</head>

<form method="post">

<p>Username : <input type="text" name="nama"><br></p>

<p>Password : <input type="password" name="password"><br></p>

<input type="button" value="Submit">

<input type="button" value="Reset">

<input type="submit" onclick="salam()" value="Salam">

</form>

<p> Ini gan nama ane :</p>

<p id="nama">

<input type="button" onclick="spoiler()" value="Spoiler :">

<p> Ini gan NPM ane :</p>

<p id="npm">

<input type="button" onclick="npm()" value="Spoiler :">

</html>

Oke saya sedikit jelaskan maksud fungsi tag diatas, Maksud listingan diatas adalah :

<head> = digunakan untuk memberikan informasi tentang dokumen.

Pada tag javascript terdiri dari 3 script yaitu salam(), spoiler(), dan npm().

1. innerHTML= untuk memberikan informasi saat button diklik.

2. Kemudian membuat sebuah tampilan username dan password yang bisa diisi oleh pengguna. Berikut tag nya :

Maksud listingan diatas adalah pada username dengan type=”text”, dan password dengan type=”password”, berarti password yang diisi akan berupa bintang (*).  Username dan password inputannya berupa text dan password.

2. Membuat tombol Submit, Reset dan Salam.

Maksudnya Submit = agar data yg diisi akan disimpan. Reset = menghapus data setelah tersimpan, Salam = saat di klik akan memanggil dari function salam() yang menghasilkan berupa keluaran :

3. Kemudian saya akan memanggil dari function javascript yang lain. Seperti gambar :

Maksudnya adalah saat kita mengklik tombol Spoiler pada “Ini gan nama ane” , maka kita akan memanggil fungsi spoiler() yang menghasilkan nama Muhammad Faris Al Fatih, dan jika mengklik tombol Spoiler pada “Ini gan NPM ane”, memanggil fungsi npm() yang menghasilkan 54411827. Seperti gambar output dibawah.

Output :

Mungkin itu saja yang bisa saya bahas, apabila ada kata yang salah dan kurang berkenan mohon dimaafkan. Terima kasih.. ^^

Wassalamu?Alaikum..

Download CodeIgniter dari Website Resminya : Disini

Download File LA 2 PWeb Lengkapnya  : Disini

</form>

Jika Menyukai Artikel di blog ini, Silahkan masukkan electronic mail sobat. Akan dapat Update artikel dari blog ini, "GRATISS!!"

0 Response to "Cara Membuat Kotak Username Dan Password Sederhana Menggunakan JavaScript Pemrograman Web"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel