javascript实现仿银行密码输入框效果的代码- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > javascript实现仿银行密码输入框效果的代码

Javascript: MooTools教程(3):数组管理DOM元素; MooTools教程(4):函数和MooTools; MooTools教程(5):事件处理; MooTools教程(6):操纵HTML DOM元素; MooTools教程(7):设置和获取样式表属性; MooTools教程(8):输入过滤-数字; MooTools教程(9):输入过滤-字符串; MooTools教程(10):Fx.Tween渐变; MooTools教程(11):Fx.Morph、Fx选项和Fx事件; MooTools教程(12):Drag.Move来实现拖放; MooTools教程(13):正则表达式; MooTools教程(14):定时器和Hash对象; MooTools教程(15):滚动条(Slider); 浏览器对Cookie的限制; 图片不间断滚动的特效代码详细讲解; Javascript教程:拖放效果研究; 不唐突的JavaScript; JavaScript教程:图片切割效果; 认识AJAX了解AJAX优点缺点和运用; 网页投票系统中的限制

No. « ‹ 166 167 168 169 › »

技术文章搜索

关键字

Javascript 中的 javascript实现仿银行密码输入框效果的代码

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-10-12 浏览: 193 ::

收藏到网摘: n/a

javascript 改变网页加载的CSS 麦鸡的TAB切换功能结合了javascript和css

效果：

点击运行可以看到效果:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title> 密码输入框 </title> <meta name="generator" content="Microsoft FrontPage 6.0"/> <meta name="author" content="lin.x"/> <meta name="keywords" content=""/> <meta name="description" content=""/> <style type="text/css"> </style> <script type="text/javascript">
function rand() { return Math.floor(Math.random()*10);
}
var rangenum = new Array();
var tem;
for (var i = 0; i<10; i++) { rangenum.push(i);
}
for (var i = 0; i<10; i++) { var a = rand(); var b = rand(); tem = rangenum[a]; rangenum[a] = rangenum[b]; rangenum[b] = tem;
}
function creatnums() { for (i=0; i<rangenum.length; i++) { document.writeln("<div class=\"nbox\" ><a href=\"#\"onclick=\"input("+rangenum[i]+")\">"+rangenum[i]+"</a></div>"); } document.writeln("<div class=\"text\"><a href=\"#\" onclick='input(-1)'>退格</a><a href=\"#\" onclick=\"clearinput()\">清除</a></div>");
}
function input(i) { var pwd=document.form.pwd.value; if (pwd.length<8||i == '-1') { if (i == '-1') { document.form.pwd.value = pwd.substring(0,pwd.length-1); } else { document.form.pwd.value = pwd+i; } clearTimeout(timer); timer=setTimeout("hiddenpad();document.getElementById('OK').focus()",4000) } else{clearTimeout(timer);alert("最多输入8位!");hiddenpad();}
}
function clearinput() { document.form.pwd.value="";
}
var timer
function showpad(){ document.getElementById('contain').style.display="block"; clearTimeout(timer) timer=setTimeout("hiddenpad()",3000)
}
function hiddenpad(){ document.getElementById('contain').style.display="none";
}
function noinput(){
var pwd=document.form.pwd.value;
document.form.pwd.value = pwd.substring(0,pwd.length-2);
} </script> </head> <body> <form name="form" action="http://www.ruanchen.com"> 请输入密码 <input type="password" name="pwd" onclick="showpad()" onkeydown="return false;" size="8"> <input type="button" value=" OK " onclick="hiddenpad()" id="OK">
</form> <div id="contain"> <script type="text/javascript"> creatnums(); </script> </div> </body>
</html>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

javascript 改变网页加载的CSS 麦鸡的TAB切换功能结合了javascript和css

Javascript 中的 javascript实现仿银行密码输入框效果的代码

评论 (0) All