js實(shí)現(xiàn)簡(jiǎn)單登錄功能的實(shí)例代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Login.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
function checkuser() {
if($('uname' == "lala") && $('pwd') == "123") {
return true;
}else {
return false;
}
}
function $(id) {
return document.getElementById(id).value;
}
</script>
</head>
<body>
<form action="ok.html">
u:<input type="text" id="uname"/><br>
p:<input type="password" id="pwd"/><br>
<input type="submit" value="登錄" onclick="return checkuser()"/>
</form>
</body>
</html>
這是登錄頁面,只有當(dāng)用戶名為lala,密碼為123時(shí)登錄成功。在onclick事件處使用return,是在用戶名和密碼輸入不符時(shí),阻止頁面跳轉(zhuǎn)。登錄成功頁面中,含有等待秒數(shù),代碼為:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ok.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
function tiao() {
clearInterval(mytime);
window.open("manage.html","_self");
}
setTimeout("tiao()",5000);
function changeSec() {
//得到myspan值
$('myspan').innerText=$('myspan').innerText-1;
}
function $(id) {
return document.getElementById(id);
}
var mytime = setInterval("changeSec()",1000);
</script>
</head>
<body>
登錄成功,<span id="myspan">5</span>秒后自動(dòng)跳轉(zhuǎn)到管理頁面
</body>
</html>
關(guān)鍵在幾個(gè)函數(shù)的使用,setTimeout("tiao()",5000);函數(shù)是打開頁面,等待5秒,調(diào)用tiao()函數(shù)。setInterval("changeSec()",1000);函數(shù)是每隔1秒調(diào)用一次changeSec()函數(shù)。這樣就完成了簡(jiǎn)單的登錄功能。
相關(guān)文章
JavaScript與jQuery中文檔就緒函數(shù)的區(qū)別
這篇文章主要介紹了JavaScript與jQuery中文檔就緒函數(shù)的區(qū)別,文章內(nèi)容介紹詳細(xì),具有一的的參考價(jià)值,需要的小伙伴可以參考一下2022-03-03簡(jiǎn)述凍結(jié)JS對(duì)象方法技術(shù)
本文主要介紹了凍結(jié)JS對(duì)象方法技術(shù),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-07-07基于JavaScript 實(shí)現(xiàn)拖放功能
本文通過實(shí)例代碼給大家介紹了JavaScript 實(shí)現(xiàn)拖放功能,代碼簡(jiǎn)單易懂,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-09-09js+css 實(shí)現(xiàn)遮罩居中彈出層(隨瀏覽器窗口滾動(dòng)條滾動(dòng))
本文為大家詳細(xì)介紹下使用js實(shí)現(xiàn)遮罩彈出層居中,且隨瀏覽器窗口滾動(dòng)條滾動(dòng),示例代碼如下,感興趣的朋友可以參考下2013-12-12通過實(shí)例解析JavaScript for in及for of區(qū)別
這篇文章主要介紹了通過實(shí)例解析JavaScript for in及for of區(qū)別,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-06-06JavaScript中的object轉(zhuǎn)換成number或string規(guī)則介紹
這篇文章主要介紹了JavaScript中的object轉(zhuǎn)換成number或string規(guī)則介紹,本文講解了object自動(dòng)轉(zhuǎn)換成string的規(guī)則、object自動(dòng)轉(zhuǎn)換成number的規(guī)則等內(nèi)容,需要的朋友可以參考下2014-12-12js實(shí)現(xiàn)圖片淡入淡出切換簡(jiǎn)易效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)圖片淡入淡出切換簡(jiǎn)易效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-08-08