Js之软键盘实现(源码)

    鉴于安全性的考虑，不少网站在登录输入密码时都采用了软键盘，避免一些键盘记录工具和木马对击键的捕捉。项目中也有这个需求，就分享给大家了，贴个效果图上来。。有兴趣的朋友可以收藏。。..如果觉得功能有点庞大，只需要数字小键盘的朋友，可参考代码精简。
下载大键盘: http://www.cnblogs.com/Files/sccxszy/softKey.rar
小键盘：http://www.cnblogs.com/Files/sccxszy/smallSoftkey.rar
效果还原:Default.aspx,softkeyboard.js,softkey.css三个文件
js代码:
softkeyboard.js
  1window.onload=
  2function()
  3{
  4password1=null;       
  5initCalc();
  6}
  7var password1;
  8var CapsLockValue=0;
  9var checkSoftKey;
 10function setVariables() {
 11tablewidth=630;
 12tableheight=20;
 13if (navigator.appName == "Netscape") {
 14horz=".left";
 15vert=".top";
 16docStyle="document.";
 17styleDoc="";
 18innerW="window.innerWidth";
 19innerH="window.innerHeight";
 20offsetX="window.pageXOffset";
 21offsetY="window.pageYOffset";
 22}
 23else {
 24horz=".pixelLeft";
 25vert=".pixelTop";
 26docStyle="";
 27styleDoc=".style";
 28innerW="document.body.clientWidth";
 29innerH="document.body.clientHeight";
 30offsetX="document.body.scrollLeft";
 31offsetY="document.body.scrollTop";
 32}
 33}
 34function checkLocation() {
 35if (checkSoftKey) {
 36objectXY="softkeyboard";
 37var availableX=eval(innerW);
 38var availableY=eval(innerH);
 39var currentX=eval(offsetX);
 40var currentY=eval(offsetY);
 41x=availableX-tablewidth+currentX;
 42y=currentY;
 43evalMove();
 44}
 45setTimeout("checkLocation()",0);
 46}
 47function evalMove() {
 48eval(docStyle + objectXY + styleDoc + vert + "=" + y);
 49}
 50self.onError=null;
 51currentX = currentY = 0; 
 52whichIt = null;          
 53lastScrollX = 0; lastScrollY = 0;
 54NS = (document.layers) ? 1 : 0;
 55IE = (document.all) ? 1: 0;
 56function heartBeat() {
 57if(IE) { diffY = document.body.scrollTop; diffX = document.body.scrollLeft; }
 58if(NS) { diffY = self.pageYOffset; diffX = self.pageXOffset; }
 59if(diffY != lastScrollY) {
 60percent = .1 * (diffY - lastScrollY);
 61if(percent > 0) percent = Math.ceil(percent);
 62else percent = Math.floor(percent);
 63if(IE) document.all.softkeyboard.style.pixelTop += percent;
 64if(NS) document.softkeyboard.top += percent;
 65lastScrollY = lastScrollY + percent;}
 66if(diffX != lastScrollX) {
 67percent = .1 * (diffX - lastScrollX);
 68if(percent > 0) percent = Math.ceil(percent);
 69else percent = Math.floor(percent);
 70if(IE) document.all.softkeyboard.style.pixelLeft += percent;
 71if(NS) document.softkeyboard.left += percent;
 72lastScrollX = lastScrollX + percent;    }        }
 73function checkFocus(x,y) {
 74stalkerx = document.softkeyboard.pageX;
 75stalkery = document.softkeyboard.pageY;
 76stalkerwidth = document.softkeyboard.clip.width;
 77stalkerheight = document.softkeyboard.clip.height;
 78if( (x > stalkerx && x < (stalkerx+stalkerwidth)) && (y > stalkery && y < (stalkery+stalkerheight))) return true;
 79else return false;}
 80function grabIt(e) {
 81checkSoftKey = false;
 82if(IE) {
 83whichIt = event.srcElement;
 84while (whichIt.id!=null&&whichIt.id.indexOf("softkeyboard") == -1) {
 85whichIt = whichIt.parentElement;
 86if (whichIt == null) { return true; } }
 87if(whichIt.style!=null){
 88whichIt.style.pixelLeft = whichIt.offsetLeft;
 89whichIt.style.pixelTop = whichIt.offsetTop;
 90}
 91currentX = (event.clientX + document.body.scrollLeft);
 92currentY = (event.clientY + document.body.scrollTop);    
 93} else {
 94window.captureEvents(Event.MOUSEMOVE);
 95if(checkFocus (e.pageX,e.pageY)) {
 96whichIt = document.softkeyboard;
 97StalkerTouchedX = e.pageX-document.softkeyboard.pageX;
 98StalkerTouchedY = e.pageY-document.softkeyboard.pageY;} }
 99return true;    }
100function moveIt(e) {
101if (whichIt == null) { return false; }
102if(IE) {
103if(whichIt.style!=null){
104newX = (event.clientX + document.body.scrollLeft);
105newY = (event.clientY + document.body.scrollTop);

 如果您对本文有任何疑问或者建议，请到讨论区发表您的意见: >> 论坛入口 <<