Untuk membuat syntax login di HTML dengan JavaScript, Anda dapat menambahkan kode JavaScript untuk memproses data login yang dikirimkan melalui form. Berikut ini adalah contoh kode dasar untuk membuat form login dengan JavaScript:
Penjelasan kode di atas:
<script>: tag pembukaan untuk menambahkan kode JavaScript di dalam halaman HTML.
function login(): fungsi JavaScript yang akan dipanggil saat tombol login ditekan.
document.getElementById("username").value: mengambil nilai input username dari form.
document.getElementById("password").value: mengambil nilai input password dari form.
if (username == "admin" && password == "admin"): melakukan pengecekan apakah username dan password yang diinputkan adalah "admin".
alert("Login berhasil"): menampilkan pesan alert jika login berhasil.
alert("Username atau password salah"): menampilkan pesan alert jika username atau password salah.
<input type="button" value="Login" onclick="login()">: membuat tombol login yang akan memanggil fungsilogin()ketika ditekan.
dan untuk pengguna yang login agar masuk ke menu lain bisa dengan menggunakan
Untuk membuat menu login agar pengguna dapat masuk ke menu lain setelah berhasil login, Anda dapat menambahkan beberapa halaman HTML dan JavaScript tambahan. Berikut adalah contoh kode dasar untuk membuat menu login dan menu utama, serta kode JavaScript untuk memproses data login:
login.html
Main.html
Pada halaman login.html, ketika pengguna berhasil login dengan username dan password yang benar, pesan alert "Login berhasil" akan muncul, dan halaman akan langsung dialihkan ke halaman main.html menggunakan fungsi window.location.href.
Pada halaman main.html, pengguna akan melihat halaman menu utama.
Untuk membuat menu yang hanya dapat diakses oleh pengguna yang sudah login, Anda juga dapat menambahkan kode JavaScript untuk memeriksa apakah pengguna sudah login sebelum mengakses halaman tertentu. Anda dapat menggunakan localStorage atau sessionStorage untuk menyimpan status login pengguna.
Berikut adalah contoh kode dasar untuk menambahkan pengecekan login pada halaman main.html:
Penjelasan kode di atas:
Pada halaman main.html, terdapat fungsi checkLogin() yang akan dipanggil ketika halaman dimuat menggunakan atribut onload pada tag <body>.
Fungsi checkLogin() akan memeriksa apakah pengguna sudah login sebelumnya dengan memeriksa nilai isLoggedIn yang disimpan pada localStorage.
Jika isLoggedIn bernilai "true", pengguna dapat mengakses halaman main.html seperti biasa.
Tidak ada komentar:
Posting Komentar