今天在CSDN中發現有一篇文章挺有意思 ,博文地址是:http://blog.csdn.net/java2000_net/article/details/6237169
特意轉載 ,文章版權歸原作者所有.下載源碼有點問題,我已改正,如下所示:
function _softkeyboard_(target,container){
var _ = _softkeyboard_;
_.target = target;
_.doc = container.ownerDocument;
(_.doc.parentWindow||_.doc.defaultView)._softkeyboard_ = _softkeyboard_;
_.skb = container;
_.skb.innerHTML = _.getkeyshtml();
var toggle = (_.skb.style.display == "block");
_.skb.style.display = toggle ? "none" : "block";
_.preventKey(target);
return toggle;
}
function closeKeyBoard()
{
document.getElementById('skb').style.display = "none";
}
_softkeyboard_.shifted = true;
_softkeyboard_.getkeyshtml = function(shifted){
var htm = [], keys = _softkeyboard_.shifted ?
["`1234567890-=","backspace","<br/>"," ","qwertyuiop[]//","<br/>"," "," ","asdfghjkl;","'","<br/>","shift","zxcvbnm,./","shift"] :
["~!@#$%^&*()_+","backspace","<br/>"," ","QWERTYUIOP{}|","<br/>"," "," ","ASDFGHJKL:",'"',"<br/>","shift","ZXCVBNM<>?","shift"];
var esp = {
"'":'<input type="button" value="/" onclick="_softkeyboard_.onkeydown(this);" />',
'"':"<input type='button' value='/' onclick='_softkeyboard_.onkeydown(this);' />",
"<br/>":"<br/>",
" ":" ",
"backspace":'<input type="button" value="<-" onclick="_softkeyboard_.backspace();" />',
"shift":'<input type="button" style="width:50px;" value="shift" onclick="_softkeyboard_.shifted=!_softkeyboard_.shifted;_softkeyboard_.skb.innerHTML = _softkeyboard_.getkeyshtml();" />'
};
for(var j = 0; j < keys.length; j++){
if(esp[keys[j]]){
htm.push(esp[keys[j]]);
}
else{
var x = new Date().getMilliseconds()%keys[j].length;
keys[j] = keys[j].substr(x,keys[j].length) + keys[j].substr(0,x);
for(var i = 0; i < keys[j].length; i++){
htm.push("<input type='button' class='key' value='"+ keys[j].charAt(i)+"' onclick='_softkeyboard_.onkeydown(this);' />");
}
}
}
htm.push("<div style= 'margin-top:5px;' mce_style='margin-top:5px;'><input type='button' onclick='closeKeyBoard()' value='确定' style='margin-right:20px;' mce_style='margin-right:20px;' /><input type='button' onclick='closeKeyBoard()' value='关闭' /><div/>");
return htm.join("");
}
_softkeyboard_.onkeydown = function(ele){
_softkeyboard_.target.value += ele.value;
_softkeyboard_.target.focus();
}
_softkeyboard_.backspace = function(){
with(_softkeyboard_.target){
value = value.substr(0,value.length-1);
}
}
_softkeyboard_.addCSSRule = function(key,value){}
_softkeyboard_.hide = function(){
if(_softkeyboard_.skb){
_softkeyboard_.skb.style.display = "none"
}
}
_softkeyboard_.preventKey = function(target){
var targetkeydown = function(e){
e = window.event?window.event:e;
switch(e.keyCode){
case 27:// esc
case 9:// tab
_softkeyboard_.hide();
if(window.event){e.returnValue = false;}else{e.preventDefault();}break;
}
};
// target.addEventListener ?
// target.addEventListener("keydown",targetkeydown,false)
// : target.attachEvent("onkeydown",targetkeydown);
}
window.top._softkeyboard_=_softkeyboard_;
_softkeyboard_.preventKey(window.top.document.body);
分享到:
相关推荐
js软键盘.js软键盘.js软键盘.js软键盘
JS软键盘JS软键盘JS软键盘JS软键盘JS软键盘JS软键盘
js 软键盘 数字软键盘 键盘 很好用。网上大多代码都是按钮点击。此软键盘全是超链接完成
文本框JS软键盘代码,好看好用
输入密码时,可以方便的使用,不信你下了试试看。
js软键盘,支持中英文切换、大小写、标点符号,可拖动显示位置,支持不同表单元素响应是否显示软键盘;内附demo示例。
js 软键盘 支持中英文输入 支持拼音、五笔输入
多款JS软键盘,其中还包括仿建行、一般、专业、数字、金额软键盘,以及常用JS兼容写法。
css+div 大键盘支持+js软键盘输入 给触摸屏做的前台程序
js软键盘仿建行软键盘, 非常方便。每次都数字键都会自动变换数字顺序
js软键盘,支持多种语言,包括中文,。。。。
这是本人自己编写,自己应用的程序,实现了软键盘的功能,可以输入键盘上大部分的字符及标点符号,可以进行大小写切换,就一个js文件,调用特别简单,显示大小可以自己设定,显示位置也可以自己设定。功能很强大,在...
类似于QQ的输入的JS软键盘.大家可以更改里面的内容. 以便于提高
JS软键盘输入,通过使用键盘输入来输入密码
建行网银使用的js软键盘,样式美观,代码简洁,是一款实用的js软键盘
jquery-softkeyboard-js 软键盘js,非常适合初学者学习研究!
js 开发的软件盘,可以很好的避免网页监听
js软键盘
NULL 博文链接:https://rain-2372.iteye.com/blog/1873192