Home > Article > Web Front-end > How to jump to the page after a few seconds in jquery
How to jump to the page after a few seconds in jquery
- 青灯夜游Original
- 2022-08-15 18:37:532277browse
Implementation steps: 1. Use the setTimeout() function to specify a timer and set the waiting seconds to execute the jump function in the timer. The syntax is "setTimeout(function(){//jump code}, Number of milliseconds to wait);"; 2. In the jump function, set "$(location).attr('href','page address');" or "$(window).attr('location',' Page address ');" statement can be used to jump to the page.
The operating environment of this tutorial: windows7 system, jquery3.6.0 version, Dell G3 computer.
jquery implements a page jump after a few seconds, which can be divided into two parts:
Set a timer to control the number of seconds to jump
Jump page
Step 1: Use the setTimeout() function to specify a timer and set the number of seconds to wait for executing the jump function in the timer
setTimeout() method will call the function after the time specified in milliseconds
The syntax format can be the following two:
setTimeout(要执行的代码, 等待的毫秒数) setTimeout(JavaScript 函数, 等待的毫秒数)
setTimeout() is set Set a specified waiting time (unit is millisecond), when the time is up, the browser will execute a specified code.
Step 2: In the setTimeout() function, use jQuery’s attribute replacement method to realize the jump
$(location ).attr()
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="js/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
setTimeout(function() {
$(location).attr('href', 'http://www.php.cn');
}, 5000);
});
});
</script>
</head>
<body>
<button>实现5秒后跳转页面</button>
</body>
</html>
##$(window).attr()
$(document).ready(function() {
$("button").click(function() {
setTimeout(function() {
$(window).attr('location','http://www.php.cn');
}, 5000);
});
});
jQuery video tutorial, web front-end video]
The above is the detailed content of How to jump to the page after a few seconds in jquery. For more information, please follow other related articles on the PHP Chinese website!