输入框+模拟键盘

1.当前事件获取

var e=window.event||test.caller.arguments[0];// 获取event对象

var el=e.target||e.srcElement;// 获取触发事件的源对象

2.获取当前事件的标签

方法:

el.tagName.toLowerCase()

实例:el.tagName.toLowerCase()=="td"&&el.rowSpan<=1&&el.colSpan<=1

备注:判断当前的事件的标签是否为td,并且符合后面两个属性

3.改变表格的跨行数

document.getElementById("td2").rowSpan="2;

4.验证函数

字母大小写:/^[a-z]$/.test(str),/^[A-Z]$/.test(str)

实例:针对于字母大小写锁的函数


一些其他的验证:

/

用途:检查输入手机号码是否正确

输入:

s:字符串

返回:

如果通过验证返回true,否则返回false

/

function checkMobile(s){

var regu =/^[1][3][0-9]{9}$/;

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

}

/**

检查输入的身份证号是否正确

输入:str  字符串

返回:true 或 flase; true表示格式正确

/

function checkCard(str) {

//15位数身份证正则表达式

var arg1 = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/;

//18位数身份证正则表达式

var arg2 = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[A-Z])$/;

if (str.match(arg1) == null && str.match(arg2) == null) {

return false;

}

else {

return true;

}

}

/**

检查输入的字符是否具有特殊字符

输入:str  字符串

返回:true 或 flase; true表示包含特殊字符

主要用于注册信息的时候验证

/

function checkQuote(str) {

var items = new Array("~", "`", "!","@", "#", "$", "%", "^", "&", "", "{", "}", "[", "]", "(", ")");

items.push(":", ";", "'", "|", "\", "<", ">", "?", "/", "<<", ">>", "||", "//");

items.push("admin", "administrators", "administrator", "管理员", "系统管理员");

items.push("select", "delete", "update", "insert", "create", "drop", "alter", "trancate");

str = str.toLowerCase();

for (var i = 0; i < items.length; i++) {

if (str.indexOf(items[i]) >= 0) {

return true;

}

}

return false;

}

/**

检查输入的URL地址是否正确

输入:str  字符串

返回:true 或 flase; true表示格式正确

/

function checkURL(str) {

if (str.match(/(http[s]?|ftp):\/\/[^\/.]+?..+\w$/i) == null) {

return false

}

else {

return true;

}

}

/

用途:检查输入的电话号码格式是否正确

输入:

strPhone:字符串

返回:

如果通过验证返回true,否则返回false

/

function checkPhone(strPhone) {

var phoneRegWithArea = /^[0][1-9]{2,3}-[0-9]{5,10}$/;

var phoneRegNoArea = /^[1-9]{1}[0-9]{5,8}$/;

//var prompt = "您输入的电话号码不正确!"

if (strPhone.length > 9) {

if (phoneRegWithArea.test(strPhone)) {

return true;

} else {

//alert( prompt );

return false;

}

} else {

if (phoneRegNoArea.test(strPhone)) {

return true;

} else {

//alert(prompt);

return false;

}

}

}

/用途:校验ip地址的格式

输入:strIP:ip地址

返回:如果通过验证返回true,否则返回false;

/

function isIP(strIP) {

if (isNull(strIP)) return false;

var re=/^(\d+).(\d+).(\d+).(\d+)$/g //匹配IP地址的正则表达式

if(re.test(strIP))

{

if( RegExp.$1 <256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256) return true;

}

return false;

}

/

用途:检查输入字符串是否为空或者全部都是空格

输入:str

返回:

如果全是空返回true,否则返回false

/

function isNull( str ){

if ( str == "" ) return true;

var regu = "^[ ]+$";

var re = new RegExp(regu);

return re.test(str);

}

/

用途:检查输入对象的值是否符合整数格式

输入:str 输入的字符串

返回:如果通过验证返回true,否则返回false

/

function isInteger( str ){

var regu = /^[-]{0,1}[0-9]{1,}$/;

return regu.test(str);

}

/

用途:检查输入字符串是否符合正整数格式

输入:

s:字符串

返回:

如果通过验证返回true,否则返回false

/

function isNumber( s ){

var regu = "^[0-9]+$";

var re = new RegExp(regu);

if (s.search(re) != -1) {

return true;

} else {

return false;

}

}

/

用途:检查输入字符串是否是带小数的数字格式,可以是负数

输入:

s:字符串

返回:

如果通过验证返回true,否则返回false

/

function isDecimal( str ){

if(isInteger(str)) return true;

var re = /^[-]{0,1}(\d+)[.]+(\d+)$/;

if (re.test(str)) {

if(RegExp.$1==0&&RegExp.$2==0) return false;

return true;

} else {

return false;

}

}

/

用途:检查输入对象的值是否符合端口号格式

输入:str 输入的字符串

返回:如果通过验证返回true,否则返回false

/

function isPort( str ){

return (isNumber(str) && str<65536);

}

/

用途:检查输入对象的值是否符合E-Mail格式

输入:str 输入的字符串

返回:如果通过验证返回true,否则返回false

/

function isEmail( str ){

var myReg = /^[-_A-Za-z0-9]+@([_A-Za-z0-9]+.)+[A-Za-z0-9]{2,3}$/;

if(myReg.test(str)) return true;

return false;

}

/

用途:检查输入字符串是否符合金额格式

格式定义为带小数的正数,小数点后最多三位

输入:

s:字符串

返回:

如果通过验证返回true,否则返回false

/

function isMoney( s ){

var regu = "^[0-9]+[.][0-9]{0,3}$";

var re = new RegExp(regu);

if (re.test(s)) {

return true;

} else {

return false;

}

}

/

用途:检查输入字符串是否只由英文字母和数字和下划线组成

输入:

s:字符串

返回:

如果通过验证返回true,否则返回false

/

function isNumberOr_Letter( s ){//判断是否是数字或字母

var regu = "^[0-9a-zA-Z_]+$";

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

}

/

用途:检查输入字符串是否只由英文字母和数字组成

输入:

s:字符串

返回:

如果通过验证返回true,否则返回false

/

function isNumberOrLetter( s ){//判断是否是数字或字母

var regu = "^[0-9a-zA-Z]+$";

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

}

/

用途:检查输入字符串是否只由汉字、字母、数字组成

输入:

value:字符串

返回:

如果通过验证返回true,否则返回false

/

function isChinaOrNumbOrLett( s ){//判断是否是汉字、字母、数字组成

var regu = "^[0-9a-zA-Z\u4e00-\u9fa5]+$";

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

}

/

用途:判断是否是日期

输入:date:日期;fmt:日期格式

返回:如果通过验证返回true,否则返回false

/

function isDate( date, fmt ) {

if (fmt==null) fmt="yyyyMMdd";

var yIndex = fmt.indexOf("yyyy");

if(yIndex==-1) return false;

var year = date.substring(yIndex,yIndex+4);

var mIndex = fmt.indexOf("MM");

if(mIndex==-1) return false;

var month = date.substring(mIndex,mIndex+2);

var dIndex = fmt.indexOf("dd");

if(dIndex==-1) return false;

var day = date.substring(dIndex,dIndex+2);

if(!isNumber(year)||year>"2100" || year< "1900") return false;

if(!isNumber(month)||month>"12" || month< "01") return false;

if(day>getMaxDay(year,month) || day< "01") return false;

return true;

}

function getMaxDay(year,month) {

if(month==4||month==6||month==9||month==11)

return "30";

if(month==2)

if(year%4==0&&year%100!=0 || year%400==0)

return "29";

else

return "28";

return "31";

}

/

用途:字符1是否以字符串2结束

输入:str1:字符串;str2:被包含的字符串

返回:如果通过验证返回true,否则返回false

/

function isLastMatch(str1,str2)

{

var index = str1.lastIndexOf(str2);

if(str1.length==index+str2.length) return true;

return false;

}

/

用途:字符1是否以字符串2开始

输入:str1:字符串;str2:被包含的字符串

返回:如果通过验证返回true,否则返回false

/

function isFirstMatch(str1,str2)

{

var index = str1.indexOf(str2);

if(index==0) return true;

return false;

}

/

用途:字符1是包含字符串2

输入:str1:字符串;str2:被包含的字符串

返回:如果通过验证返回true,否则返回false

/

function isMatch(str1,str2)

{

var index = str1.indexOf(str2);

if(index==-1) return false;

return true;

}

/

用途:检查输入的起止日期是否正确,规则为两个日期的格式正确,

且结束如期>=起始日期

输入:

startDate:起始日期,字符串

endDate:结束如期,字符串

返回:

如果通过验证返回true,否则返回false

/

function checkTwoDate( startDate,endDate ) {

if( !isDate(startDate) ) {

alert("起始日期不正确!");

return false;

} else if( !isDate(endDate) ) {

alert("终止日期不正确!");

return false;

} else if( startDate > endDate ) {

alert("起始日期不能大于终止日期!");

return false;

}

return true;

}

/

用途:检查输入的Email信箱格式是否正确

输入:

strEmail:字符串

返回:

如果通过验证返回true,否则返回false

/

function checkEmail(strEmail) {

//var emailReg = /^[_a-z0-9]+@([_a-z0-9]+.)+[a-z0-9]{2,3}$/;

var emailReg = /^[\w-]+(.[\w-]+)@[\w-]+(.[\w-]+)+$/;

if( emailReg.test(strEmail) ){

return true;

}else{

alert("您输入的Email地址格式不正确!");

return false;

}

}

/

用途:检查复选框被选中的数目

输入:

checkboxID:字符串

返回:

返回该复选框中被选中的数目

/

function checkSelect( checkboxID ) {

var check = 0;

var i=0;

if( document.all(checkboxID).length > 0 ) {

for( i=0; i

if( document.all(checkboxID).item( i ).checked ) {

check += 1;

}

}

}else{

if( document.all(checkboxID).checked )

check = 1;

}

return check;

}

function getTotalBytes(varField) {

if(varField == null)

return -1;

var totalCount = 0;

for (i = 0; i< varField.value.length; i++) {

if (varField.value.charCodeAt(i) > 127)

totalCount += 2;

else

totalCount++ ;

}

return totalCount;

}

function getFirstSelectedValue( checkboxID ){

var value = null;

var i=0;

if( document.all(checkboxID).length > 0 ){

for( i=0; i

if( document.all(checkboxID).item( i ).checked ){

value = document.all(checkboxID).item(i).value;

break;

}

}

} else {

if( document.all(checkboxID).checked )

value = document.all(checkboxID).value;

}

return value;

}

function getFirstSelectedIndex( checkboxID ){

var value = -2;

var i=0;

if( document.all(checkboxID).length > 0 ){

for( i=0; i

if( document.all(checkboxID).item( i ).checked ) {

value = i;

break;

}

}

} else {

if( document.all(checkboxID).checked )

value = -1;

}

return value;

}

function selectAll( checkboxID,status ){

if( document.all(checkboxID) == null)

return;

if( document.all(checkboxID).length > 0 ){

for( i=0; i

document.all(checkboxID).item( i ).checked = status;

}

} else {

document.all(checkboxID).checked = status;

}

}

function selectInverse( checkboxID ) {

if( document.all(checkboxID) == null)

return;

if( document.all(checkboxID).length > 0 ) {

for( i=0; i

document.all(checkboxID).item( i ).checked = !document.all(checkboxID).item( i ).checked;

}

} else {

document.all(checkboxID).checked = !document.all(checkboxID).checked;

}

}

function checkDate( value ) {

if(value=='') return true;

if(value.length!=8 || !isNumber(value)) return false;

var year = value.substring(0,4);

if(year>"2100" || year< "1900")

return false;

var month = value.substring(4,6);

if(month>"12" || month< "01") return false;

var day = value.substring(6,8);

if(day>getMaxDay(year,month) || day< "01") return false;

return true;

}

/

用途:检查输入的起止日期是否正确,规则为两个日期的格式正确或都为空

且结束日期>=起始日期

输入:

startDate:起始日期,字符串

endDate: 结束日期,字符串

返回:

如果通过验证返回true,否则返回false

/

function checkPeriod( startDate,endDate ) {

if( !checkDate(startDate) ) {

alert("起始日期不正确!");

return false;

} else if( !checkDate(endDate) ) {

alert("终止日期不正确!");

return false;

} else if( startDate > endDate ) {

alert("起始日期不能大于终止日期!");

return false;

}

return true;

}

/

用途:检查证券代码是否正确

输入:

secCode:证券代码

返回:

如果通过验证返回true,否则返回false

/

function checkSecCode( secCode ) {

if( secCode.length !=6 ){

alert("证券代码长度应该为6位");

return false;

}

if(!isNumber( secCode ) ){

alert("证券代码只能包含数字");

return false;

}

return true;

}

/***************************************************

function:cTrim(sInputString,iType)

description:字符串去空格的函数

parameters:iType:1=去掉字符串左边的空格

2=去掉字符串左边的空格

0=去掉字符串左边和右边的空格

return value:去掉空格的字符串

****************************************************/

function cTrim(sInputString,iType)

{

var sTmpStr = ' ';

var i = -1;

if(iType == 0 || iType == 1)

{

while(sTmpStr == ' ')

{

++i;

sTmpStr = sInputString.substr(i,1);

}

sInputString = sInputString.substring(i);

}

if(iType == 0 || iType == 2)

{

sTmpStr = ' ';

i = sInputString.length;

while(sTmpStr == ' ')

{

--i;

sTmpStr = sInputString.substr(i,1);

}

sInputString = sInputString.substring(0,i+1);

}

return sInputString;

}

5.数字键盘和拼音键盘的切换

在这里我是创建的两个键盘,一个拼音的和一个数字的,注意一点,每个键盘要有自己的id,以便后面getElementById来获取对象,开始数字键盘不显示display:none,然后在定义ctrKeyboard函数里面通过当前对象的offsetWidth是否大于0来判定是否显示了该键盘


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,816评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,729评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,300评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,780评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,890评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,084评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,151评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,912评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,355评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,666评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,809评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,504评论 4 334
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,150评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,882评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,121评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,628评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,724评论 2 351

推荐阅读更多精彩内容

  • 单例模式 适用场景:可能会在场景中使用到对象,但只有一个实例,加载时并不主动创建,需要时才创建 最常见的单例模式,...
    Obeing阅读 2,058评论 1 10
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,638评论 18 139
  • 《ijs》速成开发手册3.0 官方用户交流:iApp开发交流(1) 239547050iApp开发交流(2) 10...
    叶染柒丶阅读 5,099评论 0 7
  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 7,729评论 2 17
  • ¥开启¥ 【iAPP实现进入界面执行逐一显】 〖2017-08-25 15:22:14〗 《//首先开一个线程,因...
    小菜c阅读 6,377评论 0 17