Membuat Form Login dengan JavaScript di Blog
Cara Membuat Form Login
Sederhana dengan JavaScript – Pada postingan
kali ini saya akan kembali membahas hal-hal yang berkaitan dengan pemrograman
web, yakni membuat sebuah form login pada halaman web.
Pada
jejaring sosial seperti facebook, twitter, kaskus dll. Sering kali
kita menemukan sebuah form login yang mana biasanya anda di suruh untuk
memasukkan username atau email dan kemudian password anda. Hal ini dilakukan
bertujuan sebagai keamanan akun anda dari pihak yang bertanggung jawab yang
dapat menyalahgunakan akun anda.
Nah, disini akan mencoba membuat form login
sederhana dengan menggunakan javascript yang mana terdapat 2 buah inputan yakni
username dan password.
Algoritma untuk membuat form login sendiri
bisa bilang simple yakni jika username dan password dimasukkan benar maka akan
muncul pesan “Selamat anda berhasil login...!!!” dan begitu juga sebaliknya.
Source code program<html>
<script language="JavaScript">
function Login(){
<script language="JavaScript">
function Login(){
var username=document.login.username.value;
username=username.toLowerCase();
var password=document.login.password.value;
password=password.toLowerCase();
if (username=="ahmad" && password=="java"){
alert("Selamat anda berhasil login");
}
else{
alert("User name dan password anda salah!");
}
}
</script>
<body>
<form name="login">
<table width="225" cellpadding="4">
<tr><td>Username</td><td><input type="text" name="username"></td></tr>
<tr><td>Password</td><td><input type="text" name="password"></td></tr>
<tr><td colspan="2" align="right"><input type="button" value="Login" onClick="Login()"></td></tr>
</table>
</body>
password=password.toLowerCase();
if (username=="ahmad" && password=="java"){
alert("Selamat anda berhasil login");
}
else{
alert("User name dan password anda salah!");
}
}
</script>
<body>
<form name="login">
<table width="225" cellpadding="4">
<tr><td>Username</td><td><input type="text" name="username"></td></tr>
<tr><td>Password</td><td><input type="text" name="password"></td></tr>
<tr><td colspan="2" align="right"><input type="button" value="Login" onClick="Login()"></td></tr>
</table>
</body>
</html>
Printscreen output program
Semoga postingan kali ini bermanfaat buat
anda yang ingin menambah bentuk blog anda agar lebih keren dan dengan sendiri
nya pengunjung yang datang pun tertarik dengan blog anda.
Itu saja yang bisa saya sampaikan kurang lebih nya saya
minta maaf atas kekurangan nya.
Selamat mencoba…
Jangan lupa lihat artikel menarik saya yang lain nya yang
bisa menambah wawasan anda di dunia Blogging ini sekian terima kasih
anda di persilahkan untuk komentar di blog ini, agar blog ini biar saya bisa memperbaiki agar lebih baik .terimakasih atas kunjungan nya.