Cara Menciptakan Kotak Username Dan Password Sederhana Memakai Javascript Pemrograman Web
Assalamu’alaikum..
Masih Pada pembahasan Laboratorium Informatika, kali ini Praktikum Pemrograman Web ke 2 aku ingin sharing perihal Cara Membuat Kotak Username Dan Password Menggunakan Java Script. Bahannya masih sama yaitu Notepad++. Oke eksklusif saja ya disimak :
1. Buka Notepad++ dengan cara : tekan (Windows+r) – ketik notepad++ , kemudian ketikkan atau copy paste script dibawah ini :
<html>
<head>
<script type="text/javascript">
function salam(){
alert("Assalamu'alaikum Brada!!");
}
function 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 aku sedikit jelaskan maksud fungsi tag diatas, Maksud listingan diatas ialah :
<head> = dipakai untuk memperlihatkan warta perihal dokumen.
Pada tag javascript terdiri dari 3 script yaitu salam(), spoiler(), dan npm().
1. innerHTML= untuk memperlihatkan warta ketika button diklik.
2. Kemudian menciptakan sebuah tampilan username dan password yang dapat diisi oleh pengguna. Berikut tag nya :
Maksud listingan diatas ialah 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 = biar data yg diisi akan disimpan. Reset = menghapus data sehabis tersimpan, Salam = ketika di klik akan memanggil dari function salam() yang menghasilkan berupa keluaran :
3. Kemudian aku akan memanggil dari function javascript yang lain. Seperti gambar :
Maksudnya ialah ketika kita mengklik tombol Spoiler pada “Ini gan nama ane” , maka kita akan memanggil fungsi spoiler() yang menghasilkan nama Muhammad Faris Al Fatih, dan jikalau mengklik tombol Spoiler pada “Ini gan NPM ane”, memanggil fungsi npm() yang menghasilkan 54411827. Seperti gambar output dibawah.
Output :
Mungkin itu saja yang dapat aku 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
Sumber https://faris6593.blogspot.com/