Cara menambahkan halaman setelah login ke halaman html

Dalam tutorial ini, kita belajar menggunakan JavaScript untuk mengalihkan halaman web setelah 5 detik. Untuk mengalihkan halaman web setelah 5 detik, gunakan metode setInterval() untuk menyetel interval waktu. Tambahkan halaman web di jendela. lokasi. objek href

Seperti yang kita ketahui, setiap kali kita perlu memanggil fungsi atau beberapa blok kode setelah penundaan waktu tertentu, kita menggunakan metode JavaScript setTimeout() dan setInterval(). Lihat penggunaan metode ini untuk mengarahkan ulang halaman web dalam 5 detik

Untuk mengarahkan ulang halaman, kami akan menggunakan dokumen. lokasi. href atau jendela. lokasi. objek href JavaScript seperti yang ditunjukkan di bawah ini −

document.location.href="";
   OR
window.location.href="";

Mari kita pahami penggunaan metode setTimeout() dan setInterval() dengan document. lokasi. objek href satu per satu secara detail untuk menunda pengalihan halaman web selama 5 detik

Menggunakan metode setTimeout()

Kami akan menggunakan metode setTimeout() seperti biasa dengan memberinya fungsi panggilan balik dan dengan menentukan batas waktu tertentu setelah itu akan memanggil fungsi panggilan balik yang akan mengalihkan halaman web

Sintaksis

Sintaks berikut akan digunakan untuk mengimplementasikan metode setTimeout() dengan dokumen. lokasi. objek href−

setTimeout(callBack_func, timeInterval);
function callBack_func() {
   document.location.href = "";
}

Mari kita pahami implementasi kode dari metode setTimeout() untuk mengalihkan halaman setelah 5 detik

Algoritma

• Langkah 1 - Pada langkah pertama, kami akan menentukan fungsi panggilan balik untuk acara onclick yang terkait dengan tag tombol di dokumen HTML

• Langkah 2 – Pada langkah ini, kita akan memanggil metode setTimeout() dengan fungsi callback dan interval waktu di dalam fungsi yang dideklarasikan pada langkah sebelumnya

• Langkah 3 - Pada langkah terakhir, kita akan menentukan fungsi panggilan balik dari metode setTimeout() yang menggunakan dokumen. lokasi. objek href untuk mengarahkan ulang halaman setelah selang waktu tertentu

Contoh

Contoh kode di bawah ini akan menjelaskan penggunaan metode setTimeout() untuk menunda pengalihan halaman web selama 5 detik −

   
Using JavaScript to resirect a webpage after 5 seconds 
   
   Click to Redirect to Tutorials Point
   

Contoh di atas akan mengarahkan ulang halaman web ke halaman resmi tutorialspoint. com setelah 5 detik mengklik tombol dan ini terjadi karena metode setTimeout() yang digunakan dengan dokumen. lokasi. objek href dalam kode di atas

Menggunakan metode setInterval()

Kita juga bisa menggunakan metode setInterval() untuk menunda pengalihan halaman web dengan interval waktu tertentu. Namun, saat menggunakan metode setInterval() untuk tujuan ini, kita harus berhati-hati karena metode ini akan berulang kali memanggil fungsi yang diteruskan di dalamnya sebagai fungsi panggilan balik. Kita bisa menggunakan metode clearInterval() untuk menghentikannya memanggil fungsi berulang kali

Sintaksis

Sintaks berikut akan membuat Anda memahami bagaimana Anda dapat menggunakan metode setInterval() dengan metode clearInterval() serta dengan dokumen. lokasi. objek href−

var interval_name = setInterval(call_back, time_interval);
function call_back() {
   document.location.href = "";
   clearInterval(interval_name);
}

Mari kita pahami secara praktis dengan bantuan contoh kode bagaimana kita dapat menggunakan metode setInterval() untuk mengarahkan ulang halaman setelah 5 detik

Algoritma

Algoritme contoh di atas dan contoh ini hampir sama, Anda hanya perlu mengganti metode setTimeout() pada contoh sebelumnya dengan metode setInterval() dan menyimpannya ke dalam variabel, lalu Anda harus menggunakan metode clearInterval() di dalam panggilan

Contoh

Contoh di bawah ini akan mengilustrasikan penggunaan metode setInterval() serta perubahan yang perlu Anda lakukan dalam algoritme dari contoh sebelumnya –

   
Using JavaScript to redirect a webpage after 5 seconds
   
   Click to Redirect to Tutorials Point
   

Dalam contoh di atas, kami telah menggunakan metode setInterval() di dalam fungsi redirect() yang akan dipicu setelah pengguna mengklik tombol, di mana setInterval() akan memanggil fungsi pemanggilannya kembali setelah 5 detik dan mengalihkan halaman ke . lokasi. href objek dan kemudian akan menghapus interval sehingga tidak akan memanggil fungsi lagi dan mengarahkan ulang ke halaman yang sama berulang kali

Dalam tutorial ini, kita telah melihat penggunaan metode setTimeout() dan setInterval() dengan dokumen. lokasi. href objek untuk mengarahkan ulang halaman web setelah 5 detik. Kami telah membahas kedua metode ini dengan mengimplementasikannya secara praktis dengan bantuan contoh kode untuk memahami cara kerjanya dengan cara yang lebih baik

Untuk memberi tahu mesin telusur dan pengunjung situs web bahwa halaman web Anda telah dipindahkan secara permanen ke lokasi baru dengan konten yang setara, gunakan pengalihan 301. Kode "301" diartikan sebagai "dipindahkan secara permanen". (Pelajari lebih lanjut tentang Kode Status HTTP)

Cara paling sederhana untuk mengalihkan ke URL lain adalah dengan menggunakan HTMLtag dengan parameter http-equiv disetel ke "refresh". Atribut konten menyetel penundaan sebelum browser mengalihkan pengguna ke halaman web baru. Untuk segera mengalihkan, setel parameter ini ke "0" detik untuk atribut konten

Jika Anda ingin pengalihan Anda terjadi dalam waktu yang tepat, cukup tentukan parameter pilihan Anda (dalam detik) untuk konten tersebut. Mari pertimbangkan sebuah contoh, di mana kita menetapkan "7" detik sebagai waktu pengalihan

Beberapa browser tidak merender

Beberapa browser lama tidak disegarkan dengan benar saat Anda menambahkan tautan cepat. Dalam hal ini, Anda dapat menambahkan tautan jangkar agar pengguna dapat mengikuti

Bagaimana cara menampilkan halaman lain setelah login di HTML?

Bagaimana Anda menambahkan halaman baru di HTML?

Bagaimana cara menautkan halaman login saya ke halaman beranda saya di HTML?

Bagaimana cara mengarahkan ulang ke beranda setelah masuk dalam HTML?