一、监听回车键调用事件
1、jquery:
$("dom").keypress(function (even) { if (even.which == 13) { //事件处理 }});
2、JavaScript:
document.onkeydown=function(event){ var e = event || window.event || arguments.callee.caller.arguments[0]; if(e && e.keyCode==27){ // 按 Esc //事件处理 } if(e && e.keyCode==13){ // enter 键 //事件处理 }}
3、键码阐明:
keyCode 8 = BackSpace BackSpacekeyCode 9 = Tab TabkeyCode 12 = ClearkeyCode 13 = EnterkeyCode 16 = Shift_LkeyCode 17 = Control_LkeyCode 18 = Alt_LkeyCode 19 = PausekeyCode 20 = Caps_LockkeyCode 27 = Escape EscapekeyCode 32 = spacekeyCode 33 = PriorkeyCode 34 = NextkeyCode 35 = EndkeyCode 36 = HomekeyCode 37 = LeftkeyCode 38 = UpkeyCode 39 = RightkeyCode 40 = DownkeyCode 41 = SelectkeyCode 42 = PrintkeyCode 43 = ExecutekeyCode 45 = InsertkeyCode 46 = DeletekeyCode 47 = HelpkeyCode 48 = 0 equal bracerightkeyCode 49 = 1 exclam onesuperiorkeyCode 50 = 2 quotedbl twosuperiorkeyCode 51 = 3 section threesuperiorkeyCode 52 = 4 dollarkeyCode 53 = 5 percentkeyCode 54 = 6 ampersandkeyCode 55 = 7 slash braceleftkeyCode 56 = 8 parenleft bracketleftkeyCode 57 = 9 parenright bracketrightkeyCode 65 = a AkeyCode 66 = b BkeyCode 67 = c CkeyCode 68 = d DkeyCode 69 = e E EuroSignkeyCode 70 = f FkeyCode 71 = g GkeyCode 72 = h HkeyCode 73 = i IkeyCode 74 = j JkeyCode 75 = k KkeyCode 76 = l LkeyCode 77 = m M mukeyCode 78 = n NkeyCode 79 = o OkeyCode 80 = p PkeyCode 81 = q Q atkeyCode 82 = r RkeyCode 83 = s SkeyCode 84 = t TkeyCode 85 = u UkeyCode 86 = v VkeyCode 87 = w WkeyCode 88 = x XkeyCode 89 = y YkeyCode 90 = z ZkeyCode 96 = KP_0 KP_0keyCode 97 = KP_1 KP_1keyCode 98 = KP_2 KP_2keyCode 99 = KP_3 KP_3keyCode 100 = KP_4 KP_4keyCode 101 = KP_5 KP_5keyCode 102 = KP_6 KP_6keyCode 103 = KP_7 KP_7keyCode 104 = KP_8 KP_8keyCode 105 = KP_9 KP_9keyCode 106 = KP_Multiply KP_MultiplykeyCode 107 = KP_Add KP_AddkeyCode 108 = KP_Separator KP_SeparatorkeyCode 109 = KP_Subtract KP_SubtractkeyCode 110 = KP_Decimal KP_DecimalkeyCode 111 = KP_Divide KP_DividekeyCode 112 = F1keyCode 113 = F2keyCode 114 = F3keyCode 115 = F4keyCode 116 = F5keyCode 117 = F6keyCode 118 = F7keyCode 119 = F8keyCode 120 = F9keyCode 121 = F10keyCode 122 = F11keyCode 123 = F12keyCode 124 = F13keyCode 125 = F14keyCode 126 = F15keyCode 127 = F16keyCode 128 = F17keyCode 129 = F18keyCode 130 = F19keyCode 131 = F20keyCode 132 = F21keyCode 133 = F22keyCode 134 = F23keyCode 135 = F24keyCode 136 = Num_LockkeyCode 137 = Scroll_LockkeyCode 187 = acute gravekeyCode 188 = comma semicolonkeyCode 189 = minus underscorekeyCode 190 = period colonkeyCode 192 = numbersign apostrophekeyCode 210 = plusminus hyphen macronkeyCode 211 =keyCode 212 = copyright registeredkeyCode 213 = guillemotleft guillemotrightkeyCode 214 = masculine ordfemininekeyCode 215 = ae AEkeyCode 216 = cent yenkeyCode 217 = questiondown exclamdownkeyCode 218 = onequarter onehalf threequarterskeyCode 220 = less greater barkeyCode 221 = plus asterisk asciitildekeyCode 227 = multiply divisionkeyCode 228 = acircumflex AcircumflexkeyCode 229 = ecircumflex EcircumflexkeyCode 230 = icircumflex IcircumflexkeyCode 231 = ocircumflex OcircumflexkeyCode 232 = ucircumflex UcircumflexkeyCode 233 = ntilde NtildekeyCode 234 = yacute YacutekeyCode 235 = oslash OobliquekeyCode 236 = aring AringkeyCode 237 = ccedilla CcedillakeyCode 238 = thorn THORNkeyCode 239 = eth ETHkeyCode 240 = diaeresis cedilla currencykeyCode 241 = agrave Agrave atilde AtildekeyCode 242 = egrave EgravekeyCode 243 = igrave IgravekeyCode 244 = ograve Ograve otilde OtildekeyCode 245 = ugrave UgravekeyCode 246 = adiaeresis AdiaeresiskeyCode 247 = ediaeresis EdiaeresiskeyCode 248 = idiaeresis IdiaeresiskeyCode 249 = odiaeresis OdiaeresiskeyCode 250 = udiaeresis UdiaeresiskeyCode 251 = ssharp question backslashkeyCode 252 = asciicircum degreekeyCode 253 = 3 sterlingkeyCode 254 = Mode_switch
二、挪动端键盘事件处理及兼容性解决方案
1、操作系统判断
function navigator(){ var u = navigator.userAgent; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 if(isAndroid){//安卓 }; if(isiOS){//ios }; };
2、键盘的收起和开展
$(document).on("focusin",function(){//键盘弹出~~~~})$(document).on("focusout",function(){//键盘收起})
3、ios键盘收起
function navigator(){ var u = navigator.userAgent; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 if(isAndroid){ }; if(isiOS){ $(document).on("focusin",function(){ //键盘弹起时,让滚动条滚动到底部, $(window).scrollTop($("body").height()); //设置定时器 setTimeout(function(){ //获取文档高度 var clientHeight= document.body.clientHeight; //获取滚动高度--也就是键盘高度 var scrollTop = document.body.scrollTop; //让你想要的底部元素的bottom:键盘高度。 $(".bottom").css("bottom",scrollTop+"px"); //最初再设置一个定时器让滚动条回到顶部。 setTimeout(function(){ $(window).scrollTop(0); },300); },300); }); $(document).on('focusout', function () { //软键盘收起的事件处理 //让底部元素回到底部。 $(".bottom").css("bottom","0"); }); }; };
4、android键盘收起
function navigator(){ var u = navigator.userAgent; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 if(isAndroid){ var wHeight = $(window).innerHeight(); //获取初始可视 窗口高度 $(window).resize(function() { //监测窗口大小的变动事件 var hh = $(window).innerHeight(); //以后可视窗口高度 var viewTop = $(window).scrollTop(); //可视窗口高度顶部间隔网页顶部的间隔 if(wHeight > hh){ //能够作为虚构键盘弹出事件 }else{ //能够作为虚构键盘敞开事件 }; wHeight = hh; }); }; if(isiOS){ };};