HTML页面3秒后自动跳转常见的3种方法
方法1:
最简单的一种:直接在前面<head>里面添加代码:
复制代码代码如下:
<span style="font-size:18px;"> </span><span style="font-size:24px;"><meta http-equiv="refresh" content="3;URL=res.html"> </span>
<span style="font-size:24px;">//3秒之后自动跳转到res.html,两个属于同一文件下面,要是需要跳转到jsp页面,就需要在url里面填写url地址————(浏览器的'地址栏里面写入的数据,如:http://localhost:8080/TestDemo/1.jsp)</span>
方法2:
需要用到window里面的方法:
setTimeout 经过指定毫秒值后计算一个表达式。
例子:
复制代码代码如下:
window.setTimeout("alert('Hello, world')", 1000);
这个是写在js代码里面的;
具体实现如下:
复制代码代码如下:
<script type="text/javascript">
onload=function(){ <span style="white-space:pre"> </span>//在进入网页的时候加载该方法
setTimeout(go, 3000); <span style="white-space:pre"> </span> /*在js中是ms的单位*/
};
function go(){
location.href="http://localhost:8080/TestDemo/index.jsp";
}
</script>
//3秒之后自动执行go方法,直接跳转到index.jsp页面
方法3:
上面两个例子的缺陷就是能够实现跳转,但是不知道是什么时候跳转.实现倒数3-2-1;
settimeout方法已经做不了了;
setInterval 每经过指定毫秒值后计算一个表达式。
没过相同的时间,就会执行相应的函数。具体的实现方法:
复制代码代码如下:
<script type="text/javascript">
onload=function(){
setInterval(go, 1000);
};
var x=3; //利用了全局变量来执行
function go(){
x--;
if(x>0){
document.getElementById("sp").innerHTML=x; //每次设置的x的值都不一样了。
}else{
location.href='res.html';
}
}
</script>
绛旓細<script type='text/javascript'> function pload(){ setTimeout("location.href='b.html'",3000);} </script>
绛旓細<HEAD锛 2銆佸熀搴曠綉鍧鏍囪<BASE> <BASE>鏍囪鐢ㄦ潵璁惧畾URL鍦板潃锛屼竴鑸敤鏉ヨ瀹氭枃妗g殑缁濆璺緞锛鐒跺悗鍦ㄦ枃浠朵腑鍙渶鍐欎笅鐩稿璺緞 鍗冲彲銆<BASE>鐨勫熀鏈娉曪細<BASE HREF ="URL" TARGET="WINDOW NAME" >HERF灞炴ф寚瀹氫簡鏂囨。鐨刄RL浣嶇疆銆俆ARGET瀹氫箟鎵撳紑椤甸潰鐨勭獥鍙o紝WINDOW NAME鐨勫煎彲浠ヤ负鈥淿parent鈥濄佲淿blank鈥濄...
绛旓細3銆佸鏋滄偍闇瑕佸湪浠庡彟涓涓〉闈㈢Щ鍔ㄥ埌姝椤甸潰鍚庤烦杞鍒板彟涓涓綅缃紝鍒欓渶瑕佸皢<a name='jump flag'> </a>娣诲姞鍒拌烦杞綅缃綔涓鸿烦杞殑鏍囪瘑绗︺4銆佷娇鐢ㄦ椂锛屽湪鍏朵粬椤甸潰鐨勫湴鍧鏈熬娣诲姞#jump鏍囧織銆5銆佷娇鐢╦query璺宠浆锛屽紩鍏query銆6銆佹瘮濡傦細璁╅〉闈㈠钩婊戞粴鍔ㄥ埌涓涓猧d涓篵ox鐨勫厓绱犲锛屽垯JQuery浠g爜鍙涓鍙ヨ瘽銆
绛旓細鍔犱竴涓猰eta鏍囪鎴栧啓涓涓猨s浠g爜锛屾妸鍐欏ソ鐨勪唬鐮佷繚瀛樹负html鏂囦欢灏卞彲浠ヤ簡銆傜偣鑿滃崟鏍-> 宸ュ叿->internet閫夐」(鎴栭夐」) ->甯歌 鍦ㄨ繖閲岃缃富椤靛氨鍙互閫夋嫨鑷繁瑕璺宠浆鐨椤甸潰銆備唬鐮佷緥濡傦細<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-...
绛旓細鏄湪4G涓嬩笂缃戝脊鍑虹殑杩樻槸鍦ㄨ嚜瀹禬IFI寮瑰嚭鐨勶紝濡傛灉鏄疻IFI寮瑰嚭鐨灏鏄綘鐨勮矾鐢卞櫒浼拌鏄瀬璺敱鎴栬呮枑璁矾鐢卞櫒 杩欑璺敱鍣ㄩ兘缁戝畾浜嗗箍鍛婂晢鐨勫箍鍛 锛屽鏋滄槸4G灏变及璁℃槸鎴戠殑璁惧鍦ㄩ檮杩戝嚭鐜颁簡銆缃戦〉鑷姩璺宠浆鐩稿叧锛氬綋璁块棶鐢ㄦ埛鐧婚檰鍒版煇缃戠珯鏃讹紝鑷姩灏嗙敤鎴疯浆鍚戝叾瀹冪綉椤靛湴鍧鐨勪竴绉嶆妧鏈傝浆鍚戠殑缃戦〉鍦板潃鍙互鏄綉绔欏唴鐨勫叾瀹...
绛旓細鏂规硶1鐨凴esponse.Redirect 璺宠浆椤甸潰璺宠浆閫熷害涓嶅蹇紝鍥犱负瀹冩槸鏉ュ洖涓わ紙2鍥炲彂锛夛紝浣嗕粬鍙互璺宠浆鍒颁换浣曢〉闈紝娌℃湁浠讳綍闄愬埗鐨勭綉绔欓〉闈紙鍙互閫氳繃闆呰檸鎻愪緵锛佽烦鍒版柊娴級锛屽悓鏃朵笉鑳借烦杩囩櫥褰曚繚鎶ゃ備絾閫熷害鎱㈡槸鍏舵渶澶х殑缂虹偣锛侀噸瀹氬悜璺宠浆鏈哄埗锛氶鍏堟槸鍙戦佷竴涓猦ttp璇锋眰鍒板鎴风锛岄氱煡闇瑕佽烦杞埌鏂扮殑椤甸潰锛鐒跺悗瀹㈡埛绔彂閫...
绛旓細<html> <head> <title>椤甸潰璺宠浆</title> <meta http-equiv="refresh" content="3;url=http://hi.baidu.com/xiangso"> </head> <body> 姝椤甸潰涓夌鍚庤烦杞鍒癶ttp://hi.baidu.com/xiangso </body> </html> 浣犲彲浠ユ妸url鍚庨潰鐨勬崲鎴愪綘瑕佺殑鍐呭.鎴戞槸鎶婁笂闈㈢殑鍔犲伐浜嗕竴涓.鍝堝搱 ...
绛旓細3銆佽緭鍏ュ畬鎴愬悗锛屽崟鍑绘枃浠惰彍鍗曪紝鐒跺悗閫夋嫨鍙﹀瓨涓恒4銆佸湪寮瑰嚭鏉ョ殑瀵硅瘽妗嗕腑锛岄夋嫨妗岄潰涓轰繚瀛樼殑浣嶇疆锛岀劧鍚庢枃浠跺悕鍚庣紑淇敼涓.html锛岀劧鍚庡崟鍑讳繚瀛樸5銆佺劧鍚庯紝鍦ㄦ闈笂鎵惧埌淇濆瓨鐨刪tml鏂囦欢锛屽弻鍑绘墦寮銆6銆佺瓑寰30绉掑悗锛屽彲浠ョ湅鍒椤甸潰鑷姩璺宠浆鍒颁簡index1.html銆傜浉鍏冲唴瀹硅В閲婏細缃戦〉鏄瀯鎴愮綉绔欑殑鍩烘湰鍏冪礌锛屾槸鎵胯浇鍚勭缃戠珯...
绛旓細涓嬮潰鍒椾簡浜斾釜渚嬪瓙鏉ヨ缁嗚鏄庯紝杩欏嚑涓緥瀛愮殑涓昏鍔熻兘鏄細鍦5绉掑悗锛鑷姩璺宠浆鍒板悓鐩綍涓嬬殑hello.html锛堟牴鎹嚜宸遍渶瑕佽嚜琛屼慨鏀癸級鏂囦欢銆1)html鐨瀹炵幇 <head> <!-- 浠ヤ笅鏂瑰紡鍙槸鍒锋柊涓嶈烦杞埌鍏朵粬椤甸潰--> <meta http-equiv="refresh"content="10"> <!-- 浠ヤ笅鏂瑰紡瀹氭椂杞埌鍏朵粬椤甸潰--> <meta http-equiv...
绛旓細鍦╤ead閲岄潰鍔犱笂杩欐牱涓娈典唬鐮<Meta http-equiv="Refresh"Content="5;URL= http://1314.qq.com">浠ヤ笂鐨勬暟瀛5鏄簲绉掕烦杞銆倁rl鏄烦杞殑閾炬帴銆傚笇鏈涗綘涔熸槸鐜懓搴勫洯鐨勭帺瀹躲傚ぇ瀹朵竴璧蜂氦娴佺粡楠屽搱銆