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 pribadi 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/j4vascript">
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 yaitu :
<head> = dipakai untuk memperlihatkan info perihal dokumen.
Pada tag j4vascript terdiri dari 3 script yaitu salam(), spoiler(), dan npm().
1. innerHTML= untuk memperlihatkan info ketika button diklik.
2. Kemudian menciptakan sebuah tampilan username dan password yang dapat diisi oleh pengguna. Berikut tag nya :
Maksud listingan diatas yaitu 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 = semoga 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 j4vascript yang lain. Seperti gambar :
Maksudnya yaitu ketika kita mengklik tombol Spoiler pada “Ini gan nama ane” , maka kita akan memanggil fungsi spoiler() yang menghasilkan nama Muhammad Faris Al Fatih, dan bila 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
EmoticonEmoticon