网页制作实现网页页面跳转的几种方法示例全解析

目录
[隐藏]

一 三种网页跳转代码

如果你要在服务器端(asp)跳转,可以这样:

Response.Redirect('https://lzw.me')
Response.End

如果你要在客户端跳转,可以这样:

<script language="javascript" type="text/javascript">
window.location="https://lzw.me";
</script>

如果你要让页面显示几秒钟之后跳转,可以在html代码的<head></head>部分加上这样的代码:

<meta http-equiv="refresh" content="3; url=http://lzw.me">
(3秒钟后自动跳转到 lzw.me)

以上三种是也比较常见,比较常用的网页跳转代码运行平台Win9x WinNT Win2000 WinME WinXP。

二 几段简单的网页跳转代码

不隐藏转向之后的地址 代码一:

<html>
<body>
<form name=loading>
<P align=center><FONT face=Arial color=#0066ff size=2>loading...</FONT> <INPUT 
style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-WEIGHT: bolder; PADDING-BOTTOM: 0px; COLOR: #0066ff; BORDER-TOP-style: none; PADDING-TOP: 0px; FONT-FAMILY: Arial; BORDER-RIGHT-style: none; BORDER-LEFT-style: none; BACKGROUND-COLOR: white; BORDER-BOTTOM-style: none" 
size=46 name=chart> <BR><INPUT 
style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; BORDER-LEFT: medium none; COLOR: #0066ff; BORDER-BOTTOM: medium none; TEXT-ALIGN: center" 
size=47 name=percent>
<SCRIPT> 
var bar=0 
var line="||" 
var amount="||" 
count() 
function count(){ 
bar=bar+2 
amount =amount + line 
document.loading.chart.value=amount 
document.loading.percent.value=bar+"%" 
if (bar<99) 
{setTimeout("count()",100);} 
else 
{window.location = "http://lzw.me";} 
}</SCRIPT>
</P></form>
</body>
</html> 

不隐藏转向之后的地址 代码二:

<html>
<body>
<script language="javascript">
<!--
function goToURL() { //v2.0
for (var i=0; i< (goToURL.arguments.length - 1); i+=2) //with arg pairs
eval(goToURL.arguments+".location=''"+goToURL.arguments[i+1]+"''");
document.returnvalue = false;
}
//-->
</script>
<body bgcolor="#FFFFFF">
</body>
</html>

不隐藏转向之后的地址 代码三:

<html>
<SCRIPT LANGUAGE="javascript">
<!-- Start Code
var ver = navigator.appVersion;
if (ver.indexOf("MSIE") != -1)
{
window.location.href="http://lzw.me"
}else
window.location.href="http://lzw.me"
// End Code -->
</SCRIPT>
</html>

不隐藏转向之后的地址 代码四:

<html>
<body>
<meta http-equiv="refresh" content="0.1;url=http://lzw.me">
</body>
</html>

可隐藏转向之后的地址:

<html>
<frameset framespacing="0" border="0" rows="0" frameborder="0">
<frame name="main" src="http://zhiwneweb.cn" scrolling="auto" noresize>
</frameset>
</html>

网页跳转

<meta http-equiv="refresh" content="3;rul=跳转的网页">

此代码可以让网页在一定的时间内,跳转到另外一个网页上,其中content=” 为跳转前停暂的秒数,rul= 为跳转的网址

<meta http-equiv="refresh" content="3;rul=跳转的网页">

此代码可以让网页在一定的时间内,跳转到另外一个网页上,其中content=” 为跳转前停暂的秒数,rul= 为跳转的网址

<html>
<head>
<title>网页跳转</title>
<meta http-equiv="refresh" content="0;url=http://lzw.me">
</head>
<body>
</body>
</html>

1,页面自动刷新:把如下代码加入<head>区域中

<meta http-equiv="refresh" content="20">

其中20指每隔20秒刷新一次页面.
2,页面自动跳转:把如下代码加入</head><head>区域中

<meta http-equiv="refresh" content="20;url=http://lzw.me">

其中20指隔20秒后跳转到http://lzw.me页面。

<html>
<head>
<title>正在进入>>> Loading>>> </title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> </p><tr> <td width=724>
<p align=center><font color="red" size="2">正在进入,请等待,谢谢......</font></p></td></tr><tr>
<td width="724">
<p align=center>
<form name=loading>
<div align=center>
<p>
<input type=text name=chart size=46 style="font-family:Arial; font-weight:bolder; color:rgb(124,119,119); background-color:white; padding:0px; border-style:none;">
<br /> <input type=text name=percent size=46 style="color:rgb(138,134,134); text-align:center; border-width:medium; border-style:none;"><script>var bar = 0
var line = "||"
var amount ="||"
count()
function count(){
bar= bar+2
amount =amount     +     line
document.loading.chart.value=amount
document.loading.percent.value=bar+"%"
if (bar<99)
{setTimeout("count()",10);}
else
{window.location = "http://lzw.me";}
}</script>
</body>
</html>

如果要cgi的文件,可以用以下方式:

#!/usr/bin/perl
print "Content-type:text/html ";
print<<END;
<html>
<head>
<title>正在进入 http://lzw.me >>> Loading>>> </title>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<p> </p><tr> <td width=724>
<p align=center> </p>
<p align=center><b><font size="6">新地址:</font><font color="red" size="6"> http://lzw.me
!</font></b></p>
<p align=center><b><font size="6">正在进入,请等待,谢谢......</font></b></p></td></tr><tr>
<td width="724">
<p align=center>
<form name=loading>
<div align=center>
<p>
<input type=text name=chart size=46 style="font-family:Arial; font-weight:bolder; color:rgb(124,119,119); background-color:white; padding:0px;
border-style:none;">
<br /> <input type=text name=percent size=46 style="color:rgb(138,134,134); text-align:center; border-width:medium; border-style:none;"
><script>
var bar = 0
var line = "||"
var amount ="||"
count()
function count(){
    bar= bar+2
    amount = amount + line
    document.loading.chart.value = amount
    document.loading.percent.value = bar + "%"
    if (bar < 99) {
        setTimeout("count()", 10);
    } else {
        window.location = "http://lzw.me";
    }
}
</script>
</body>
</html>
END
exit;

以 htm 可以用以下方式:

<html>
<body>
<script language=&apos;javascript&apos;>document.location= &apos;http://l39.net/lb5000/leoboard.cgi&apos;</script>
</body>
</html>

以 asp 可以用以下方式:

<%
response.redirect "http://l39.net/lb5000/leoboard.cgi"
%>

  1. </head><head></head>区域加入
<meta http-equiv=Pragma content=no-cache>
<Meta http-equiv="refresh" content="3;url=http://lzw.me "> 
  1. JavaScript
<html><body>
<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
redirTime = "3000";
redirURL = "http://lzw.me/";
function redirTimer() { self.setTimeout("self.location.href = redirURL;",redirTime); }
//     End -->
</script>
</body></html>
  1. JavaScript
<html><head><title>稍候。。。</title></head>
<body>
<script language='javascript'>document.location = 'http://lzw.me'</script>
</body>
</html> 
  1. 带进度条的页面跳转代码
<html>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312">
<title>新视听资源共享论坛</title>
</head>
<body>
<form name=loading>
<P align=center><FONT face=Arial color=#0066ff size=2>loading...</FONT> <INPUT
style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-WEIGHT: bolder; PADDING-BOTTOM: 0px; COLOR: #0066ff; BORDER-TOP-style: none; PADDING-TOP: 0px; FONT-FAMILY: Arial; BORDER-RIGHT-style: none; BORDER-LEFT-style: none; BACKGROUND-COLOR: white; BORDER-BOTTOM-style: none"
size=46 name=chart> <BR><INPUT
style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; BORDER-LEFT: medium none; COLOR: #0066ff; BORDER-BOTTOM: medium none; TEXT-ALIGN: center"
size=47 name=percent>
<SCRIPT>
var bar=0
var line="||"
var amount="||"
count()
function count(){
bar=bar+2
amount =amount + line
document.loading.chart.value=amount
document.loading.percent.value=bar+"%"
if (bar<99)
{setTimeout("count()",100);}
else
{window.location = "http://lzw.me/";}
}</SCRIPT>
</P></form>
</body>
</html>

五 网页跳转方法+代码

  1. window.location
<body onload=window.location="http://lzw.me"></body>

或(此法应用范围较广,并可应用在一般后台编辑器中)

<script>window.location="http://xxx"</script>
  1. META标志
<META HTTP-EQUIV=refresh content="0; url=http://www.***.com(请换成你的网址)">
//其中content后面的阿拉伯数字是代表过几秒中钟转入目标网页。
  1. 利用框架隐藏转向地址(此方法不便用 dreamweaver 编辑,请使用记事本或其他文本编辑器处理)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>知觅__朱高站</title>
</head>
<frameset rows="*,0" frameborder="no" border="0" framespacing="0">
<frame src="http://lzw.me" name="mainFrame" id="mainFrame">
<frame src="" name="bottomFrame" scrolling="No" noresize="noresize" id="bottomFrame">
</frameset>
<noframes>
<body>

</body>
</noframes>
</html>

<html> 
<head> 
<title>页面跳转</title> 
<meta http-equiv="refresh" content="3;url=http://lzw.me"> 
</head> 
<body> 
此页面三秒后跳转到http://lzw.me
</body> 
</html>

七 html中跳转最全代码

<html>
<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>正在进入</title>
</head>
<body>
<form name=loading>
 <p align=center> <font color="#0066ff" size="2">正在进入,请稍等</font><font color="#0066ff" size="2" face="Arial">...</font>
  <input type=text name=chart size=46 style="font-family:Arial; font-weight:bolder; color:#0066ff; background-color:#fef4d9; padding:0px; border-style:none;">
  <input type=text name=percent size=47 style="color:#0066ff; text-align:center; border-width:medium; border-style:none;"> 
  <script>  
var bar=0  
var line="||"  
var amount="||"  
count()  
function count(){  
bar=bar+2  
amount =amount + line  
document.loading.chart.value=amount  
document.loading.percent.value=bar+"%"  
if (bar<99)  
{setTimeout("count()",100);}  
else  
{window.location = "http://lzw.me";}  
}</script> 
 </p> 
</form> 
<p align="center"> 如果您的浏览器不支持跳转,<a style="text-decoration: none" href="http://lzw.me"><font color="#FF0000">请点这里</font></a>.</p>
</body>
</html>

一个弹出窗口的代码

<script LANGUAGE="javascript"> window.open ('http://lzw.me', 'newwindow', 'height=400, width=500, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no')</script>

浮动广告代码

<script>
var imagepath = "http://www.baidu.com/img/logo.gif" //这里是浮动图片的地址
var imagewidth = 171 //这两行写图片的大小
var imageheight = 133
var speed = 3;
var imageclick = "http://lzw.me/" //这里写点击图片连接到的地址
var hideafter = 0
var isie = 0;
if (window.navigator.appName == "Microsoft Internet Explorer" && window.navigator.appVersion.substring(window.navigator.appVersion.indexOf("MSIE") + 5, window.navigator.appVersion.indexOf("MSIE") + 8) >= 5.5) {
    isie = 1;
} else {
    isie = 0;
}
if (isie) {
    var preloadit = new Image();
    preloadit.src = imagepath;
}

function pop() {
    if (isie) {
        x = x + dx;
        y = y + dy;
        oPopup.show(x, y, imagewidth, imageheight);
        if (x + imagewidth + 5 > screen.width) dx = -dx;
        if (y + imageheight + 5 > screen.height) dy = -dy;
        if (x < 0) dx = -dx;
        if (y < 0) dy = -dy;
        startani = setTimeout("pop();", 50);
    }
}

function dismisspopup() {
    clearTimeout(startani)
    oPopup.hide()
}

function dowhat() {
    if (imageclick == "dismiss") {
        dismisspopup()
    } else {
        window.open(imageclick);
    }
}
if (isie) {
    var x = 0,
        y = 0,
        dx = speed,
        dy = speed;
    var oPopup = window.cr & #101;atePopup();
    var oPopupBody = oPopup.document.body;
    oPopupBody.style.cursor = "hand";
    oPopupBody.innerHTML = '<IMG SRC= "'+preloadit.src+'" >';
    oPopup.document.body.onmouseover= new Function("clearTimeout(startani)");
    oPopup.document.body.onmouseout = pop;
    oPopup.document.body.onclick = dowhat;
    pop();
    if (hideafter > 0) {
        setTimeout("dismisspopup()", hideafter * 1000)
    }
}
</script>
点赞 (0)

发表评论

电子邮件地址不会被公开。 必填项已用*标注