輸入框+模擬鍵盤

1.當前事件獲取

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

var el=e.target||e.srcElement;// 獲取觸發(fā)事件的源對象

2.獲取當前事件的標簽

方法：

el.tagName.toLowerCase()

實例：el.tagName.toLowerCase()=="td"&&el.rowSpan<=1&&el.colSpan<=1

備注：判斷當前的事件的標簽是否為td，并且符合后面兩個屬性

3.改變表格的跨行數(shù)

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

4.驗證函數(shù)

字母大小寫：/^[a-z]$/.test(str)，/^[A-Z]$/.test(str)

實例：針對于字母大小寫鎖的函數(shù)

一些其他的驗證：

用途：檢查輸入手機號碼是否正確

輸入：

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位數(shù)身份證正則表達式

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

//18位數(shù)身份證正則表達式

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(":", ";", "'", "|", "\", "<", ">", "?", "/", "<<", ">>", "||", "http://");

items.push("admin", "administrators", "administrator", "管理員", "系統(tǒng)管理員");

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);

}

用途：檢查輸入對象的值是否符合整數(shù)格式

輸入：str 輸入的字符串

返回：如果通過驗證返回true,否則返回false

function isInteger( str ){

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

return regu.test(str);

}

用途：檢查輸入字符串是否符合正整數(shù)格式

輸入：

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;

}

用途：檢查輸入字符串是否是帶小數(shù)的數(shù)字格式,可以是負數(shù)

輸入：

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;

}

用途：檢查輸入字符串是否符合金額格式

格式定義為帶小數(shù)的正數(shù)右锨，小數(shù)點后最多三位

輸入：

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;

}

用途：檢查輸入字符串是否只由英文字母和數(shù)字和下劃線組成

輸入：

s：字符串

返回：

如果通過驗證返回true,否則返回false

function isNumberOr_Letter( s ){//判斷是否是數(shù)字或字母

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

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

用途：檢查輸入字符串是否只由英文字母和數(shù)字組成

輸入：

s：字符串

返回：

如果通過驗證返回true,否則返回false

function isNumberOrLetter( s ){//判斷是否是數(shù)字或字母

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

var re = new RegExp(regu);

if (re.test(s)) {

return true;

}else{

return false;

}

用途：檢查輸入字符串是否只由漢字籍凝、字母差油、數(shù)字組成

輸入：

value：字符串

返回：

如果通過驗證返回true,否則返回false

function isChinaOrNumbOrLett( s ){//判斷是否是漢字驶冒、字母翠语、數(shù)字組成

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;

}

用途：檢查輸入的起止日期是否正確泛范，規(guī)則為兩個日期的格式正確让虐，

且結束如期>=起始日期

輸入：

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;

}

用途：檢查復選框被選中的數(shù)目

輸入：

checkboxID：字符串

返回：

返回該復選框中被選中的數(shù)目

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;

}

用途：檢查輸入的起止日期是否正確，規(guī)則為兩個日期的格式正確或都為空

且結束日期>=起始日期

輸入：

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("證券代碼只能包含數(shù)字");

return false;

}

return true;

}

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

function:cTrim(sInputString,iType)

description:字符串去空格的函數(shù)

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.數(shù)字鍵盤和拼音鍵盤的切換

在這里我是創(chuàng)建的兩個鍵盤辩稽，一個拼音的和一個數(shù)字的惧笛，注意一點，每個鍵盤要有自己的id逞泄，以便后面getElementById來獲取對象患整，開始數(shù)字鍵盤不顯示display：none拜效，然后在定義ctrKeyboard函數(shù)里面通過當前對象的offsetWidth是否大于0來判定是否顯示了該鍵盤

最后編輯于：2017.12.04 12:42:56

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者

人面猴
序言：七十年代末，一起剝皮案震驚了整個濱河市各谚，隨后出現(xiàn)的幾起案子紧憾，更是在濱河造成了極大的恐慌，老刑警劉巖昌渤，帶你破解...
沈念sama閱讀 216,997評論 6贊 502
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件赴穗，死亡現(xiàn)場離奇詭異，居然都是意外死亡膀息，警方通過查閱死者的電腦和手機般眉，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 92,603評論 3贊 392
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進店門，熙熙樓的掌柜王于貴愁眉苦臉地迎上來潜支，“玉大人甸赃，你說我怎么就攤上這事∪吣穑” “怎么了埠对？”我有些...
開封第一講書人閱讀 163,359評論 0贊 353
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵，是天一觀的道長裁替。經常有香客問我项玛，道長，這世上最難降的妖魔是什么胯究？我笑而不...
開封第一講書人閱讀 58,309評論 1贊 292
?港島之戀（遺憾婚禮）
正文為了忘掉前任稍计，我火速辦了婚禮，結果婚禮上裕循，老公的妹妹穿的比我還像新娘臣嚣。我一直安慰自己，他們只是感情好剥哑，可當我...
茶點故事閱讀 67,346評論 6贊 390
惡毒庶女頂嫁案：這布局不是一般人想出來的
文/花漫我一把揭開白布硅则。她就那樣靜靜地躺著，像睡著了一般株婴。火紅的嫁衣襯著肌膚如雪怎虫。梳的紋絲不亂的頭發(fā)上，一...
開封第一講書人閱讀 51,258評論 1贊 300
城市分裂傳說
那天困介，我揣著相機與錄音大审，去河邊找鬼。笑死座哩，一個胖子當著我的面吹牛徒扶，可吹牛的內容都是我干的。我是一名探鬼主播根穷，決...
沈念sama閱讀 40,122評論 3贊 418
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼姜骡，長吁一口氣：“原來是場噩夢啊……” “哼导坟！你這毒婦竟也來了？” 一聲冷哼從身側響起圈澈，我...
開封第一講書人閱讀 38,970評論 0贊 275
萬榮殺人案實錄
序言：老撾萬榮一對情侶失蹤惫周，失蹤者是張志新（化名）和其女友劉穎，沒想到半個月后康栈，有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體递递，經...
沈念sama閱讀 45,403評論 1贊 313
?護林員之死
正文獨居荒郊野嶺守林人離奇死亡，尸身上長有42處帶血的膿包…… 初始之章·張勛以下內容為張勛視角年9月15日...
茶點故事閱讀 37,596評論 3贊 334
?白月光啟示錄
正文我和宋清朗相戀三年啥么，在試婚紗的時候發(fā)現(xiàn)自己被綠了漾狼。大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
茶點故事閱讀 39,769評論 1贊 348
活死人
序言：一個原本活蹦亂跳的男人離奇死亡饥臂，死狀恐怖逊躁，靈堂內的尸體忽然破棺而出，到底是詐尸還是另有隱情隅熙，我是刑警寧澤稽煤，帶...
沈念sama閱讀 35,464評論 5贊 344
?日本核電站爆炸內幕
正文年R本政府宣布，位于F島的核電站囚戚，受9級特大地震影響酵熙，放射性物質發(fā)生泄漏。R本人自食惡果不足惜驰坊，卻給世界環(huán)境...
茶點故事閱讀 41,075評論 3贊 327
男人毒藥：我在死后第九天來索命
文/蒙蒙一匾二、第九天我趴在偏房一處隱蔽的房頂上張望。院中可真熱鬧拳芙，春花似錦察藐、人聲如沸。這莊子的主人今日做“春日...
開封第一講書人閱讀 31,705評論 0贊 22
一樁弒父案分飞，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽。三九已至睹限，卻和暖如春譬猫，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背羡疗。一陣腳步聲響...
開封第一講書人閱讀 32,848評論 1贊 269
情欲美人皮
我被黑心中介騙來泰國打工染服，沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留，地道東北人叨恨。一個月前我還...
沈念sama閱讀 47,831評論 2贊 370
代替公主和親
正文我出身青樓柳刮，卻偏偏與公主長得像，于是被迫代替她去往敵國和親。傳聞我的和親對象是個殘疾皇子诚亚，可洞房花燭夜當晚...
茶點故事閱讀 44,678評論 2贊 354

輸入框+模擬鍵盤

推薦閱讀更多精彩內容