html登录界面设计（html网页登录界面跳转设计）
本文目录
html网页登录界面跳转设计
下面列了五个例子来详细说明，这几个例子的主要功能是：在5秒后，自动跳转到同目录下的hello.html（根据自己需要自行修改）文件。
1) html的实现
《head》
《!-- 以下方式只是刷新不跳转到其他页面 --》
《meta http-equiv="refresh" content="10"》
《!-- 以下方式定时转到其他页面 --》
《meta http-equiv="refresh" content="5;url=hello.html"》
《/head》
优点：简单
缺点：Struts Tiles中无法使用
2) javascript的实现
《script language="javascript" type="text/javascript"》
// 以下方式直接跳转
window.location.href=’hello.html’;
// 以下方式定时跳转
setTimeout("javascript:location.href=’hello.html’", 5000);
《/script》
优点：灵活，可以结合更多的其他功能
缺点：受到不同浏览器的影响
3) 结合了倒数的javascript实现（IE）
《span id="totalSecond"》5《/span》
《script language="javascript" type="text/javascript"》
var second = totalSecond.innerText;
setInterval("redirect()", 1000);
function redirect(){
totalSecond.innerText=--second;
if(second《0) location.href=’hello.html’;
}
《/script》
优点：更人性化
缺点：firefox不支持（firefox不支持span、div等的innerText属性）
3’) 结合了倒数的javascript实现（firefox）
《script language="javascript" type="text/javascript"》
var second = document.getElementById(’totalSecond’).textContent;
setInterval("redirect()", 1000);
function redirect()
{
document.getElementById(’totalSecond’).textContent = --second;
if (second 《 0) location.href = ’hello.html’;
}
《/script》
4) 解决Firefox不支持innerText的问题
《span id="totalSecond"》5《/span》
《script language="javascript" type="text/javascript"》
if(navigator.appName.indexOf("Explorer") 》 -1){
document.getElementById(’totalSecond’).innerText = "my text innerText";
} else{
document.getElementById(’totalSecond’).textContent = "my text textContent";
}
《/script》
5) 整合3)和3’)
《span id="totalSecond"》5《/span》
《script language="javascript" type="text/javascript"》
var second = document.getElementById(’totalSecond’).textContent;
if (navigator.appName.indexOf("Explorer") 》 -1) {
second = document.getElementById(’totalSecond’).innerText;
} else {
second = document.getElementById(’totalSecond’).textContent;
}
setInterval("redirect()", 1000);
function redirect() {
if (second 《 0) {
location.href = ’hello.html’;
} else {
if (navigator.appName.indexOf("Explorer") 》 -1) {
document.getElementById(’totalSecond’).innerText = second--;
} else {
document.getElementById(’totalSecond’).textContent = second--;
}
}
}
《/script》
参考http://www.cnblogs.com/aszx0413/articles/1886819.html
html登陆界面代码
《form method="post" action="###" name="myform" onsubmit="checkpost()"》
《label for="name"》用户名：《/label》《input type="text" name="name" id="name" /》《br /》
《label for="pw"》密码：《/label》《input type="password" name="pw" id="pw" /》《br /》
《input type="submit" value="提交" /》
《/form》
《script》
function checkpost(){
if(document.forms.pw.value=="你要的密码"){
window.location="你要跳转的地址";
}else{
alert("用户名或密码不正确！")
return false;
}
}
《/script》
html登陆界面代码是什么
\x0d\x0a怎么用html做一个系统登录界面文本框前有小图案
更多文章：
国际营销云app（以用户为中心，数势营销云为企业数字化经营创造更大的价值）
2026年5月2日 13:35
2026年4月30日 22:48
新手seo助理的日常工作内容：新手seo助理如何规划自己的职业发展
2026年6月27日 17:09
2026年5月9日 08:30
温州app软件开发（同城配送app软件有哪些，哪个比较好用）
2026年5月6日 12:07
新站如何利用长尾词提升.top域名搜索流量：男士真皮钱包推荐
2026年6月27日 18:15
2026年4月23日 11:00
2026年5月12日 12:43
2026年5月24日 04:36
2026年5月4日 01:03
2026年6月6日 03:21
四平市人民政府网（2022年吉林四平市事业单位事业编制专业人才引进公告【122人】）
2026年4月20日 21:01
2026年6月7日 00:21
2026年5月27日 11:03
2026年4月15日 22:31
2026年4月26日 04:13
2026年6月12日 17:30
2026年4月22日 19:49
2026年5月1日 11:24
2026年6月5日 08:54
