Cara redirect ke halaman lain di javascript onload

Pengalihan halaman adalah situasi di mana Anda mengklik URL untuk mencapai halaman X tetapi secara internal Anda diarahkan ke halaman lain Y. Itu terjadi karena pengalihan halaman. Perancang situs web mengandalkan pengalihan ketika ada kebutuhan untuk mengubah tata letak situs web tertentu atau lokasi halaman tertentu

Untuk mengalihkan dari halaman HTML, kami menggunakan Tag META. Bersamaan dengan ini, kami juga menggunakan atribut http-equiv untuk menyediakan header HTTP untuk nilai atribut konten. Nilai dalam konten adalah jumlah detik;

Setel atribut konten ke 0, jika Anda ingin segera memuatnya. Jika tidak, tetapkan waktu dalam detik jika Anda ingin menunda pengalihan sebentar

Sintaksis

Seperti yang dapat kita amati bahwa pengalihan memerlukan dua parameter −

  • Waktu. mewakili penundaan sebelum browser mengalihkan pengguna ke halaman lain

  • URL_baru. mewakili alamat URL yang kita butuhkan untuk mengarahkan ulang pengguna setelah penundaan

Berikut ini adalah contohnya…

Contoh

Dalam contoh berikut kami mengalihkan halaman ke halaman lain dengan menentukan tautan URL di

HTML Redirect WELCOME TO Tutorialspoint

you'll be redirected to Tutorialspoint Homepage, in 5 seconds.

_

Segera setelah Anda menjalankan kode, jendela browser terbuka dan menunggu selama 5 detik sebelum secara otomatis dialihkan ke beranda titik tutorial

Jika kami menghadapi kesalahan saat mengalihkan ke halaman lain atau kadang-kadang menunda pengalihan halaman, itu mungkin terjadi jika kami menggunakan browser lama. Selain itu, kami akan menyebutkan tautan baru ke halaman web

If you are not redirected in five seconds, click here.

Saat menjalankan skrip di atas, halaman web muncul dengan tautan yang kami sebutkan menggunakan a, untuk menghindari penundaan pengalihan

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

Bagaimana cara mengarahkan ke halaman lain di JavaScript saat dimuat?

url- ini adalah URL halaman web baru. .
href. Jendela. lokasi. properti href dapat digunakan untuk mengalihkan ke halaman lain. .
mengganti() metode. Lokasinya. metode replace(url) dapat digunakan untuk mengganti halaman web saat ini dengan halaman web lain yang diambil dari url. .
menetapkan()

Bagaimana cara mengarahkan ulang ke halaman lain saat dimuat?

Cara Mengarahkan ke Halaman Lain di HTML. Untuk mengalihkan satu halaman HTML ke halaman lain, Anda perlu menambahkan tag . Bagian

Bagaimana cara mengalihkan bagian ke halaman lain?

Seseorang dapat menggunakan tag jangkar untuk mengalihkan ke bagian tertentu pada halaman yang sama . Anda perlu menambahkan "atribut id" ke bagian yang ingin Anda tampilkan dan menggunakan id yang sama di atribut href dengan "#" di tag jangkar.

Bagaimana cara mengarahkan ulang ke domain lain di JavaScript?

Ringkasan .
Untuk mengalihkan ke URL atau halaman baru, Anda menetapkan URL baru ke lokasi. href atau gunakan lokasi. menetapkan () metode
Lokasinya. metode replace() mengalihkan ke URL baru tetapi tidak membuat entri dalam tumpukan riwayat browser