葡京娱乐场官网jQuery事件之键盘事件,事件指标

事件目标

键盘事件处理全部用户在键盘敲击的动静,不管在文书输入区域之中依然外部。键盘事件在差别的浏览器中效果的范围是区别的,平时那种键盘事件能够效率于
Form成分,a标签元素,window
,document那样的成分上。在具有能够赢得交点的因素上是能够触发键盘事件的,能够获取主旨的要素得以如此通晓,在动用Tab键的时候能够跳跃到的因素正是足以采用键盘事件的元(在尚未为那个要素设置tabindex属性值的场所下,当tabindex设置为负数的时候,在利用Tab键的时候就不会获得主旨)。

1、什么是事件目的

在Javascript中,当事件发生时,系统会将一种类与之有关的音讯都停放于3个指标中,这几个目的正是事件目的。

如点击键盘按键时,系统会将如今按键的键值放入事件目的中

如当鼠标移动事件时有发生时,系统会将如今鼠标的横纵坐标音讯都放入事件指标中

   
键盘事件能够传递八个参数event,其实具有的jQuery事件都可以传递这么3个参数,这几个event是一个对象,其包含一些品质,在触发事件的时候可以通过event来博取部分关于事件的值,比如在应用键盘的时候能够利用event.keyCode来取得所按下键的ASCII码的值。见下文

贰 、获取事件目的

在分化浏览器下,事件指标的得到格局也是不一致的

1:keydown()事件是键盘点击时接触的首先个键盘事件,假使用户继续按住键位,keydown事件会频频拓展。

1)IE内核的浏览器:

var 事件指标 =
window.event;

复制代码 代码如下:

2)W3C内核的浏览器:

dom对象.事件 = function(event) {

    var 事件指标 = event;

}

葡京娱乐场官网 1

      $(‘input’).keydown(function(event){
        alert(event.keyCode);
        });

③ 、使用事件目的获得键盘按键的键值

葡京娱乐场官网 2

葡京娱乐场官网 3

     
通过键盘重临的值能够完毕更加多的关于那几个要素的支配,比如说上下左右键,分别是:38,40,37,39

2:keypress()事件和keydown是大半的,只有2个差别,虽然急需阻止按键的默许行为,你必须是啊就keypress事件。

4、使用事件目的模拟推箱子的小游戏

葡京娱乐场官网 4

葡京娱乐场官网 5

葡京娱乐场官网 6

3:keyup()事件是最后二个发生的事件(在keydown事件随后),不想keydown事件,该事件在撒手键盘是仅触发3遍(因为松开键盘并不是1个相接的事态)。

复制代码 代码如下:

      $(‘input’).keyup(funciton(){
          alert(‘keyup function is running!!’);
        });

4:在jQuery中keydown,keypress,keyup事件是按自然的各种执行的。

复制代码 代码如下:

        $(‘input’).keyup(function(){
          console.log(‘keyup’);
          });
        $(‘input’).keydown(function(){
          console.log(‘keydown’);
          });
        $(‘input’).keypress(function(){
          console.log(‘keypress’);
          });

      执行结果是:keydown ,keypress ,keyup .
     
在此地不选用alert是因为在alert的时候会阻拦一些事件的发生,在此间是会阻止keyup事件的发出,要想尝试那端代码,可以在Firefox下开展,需要在浏览器上装上firebug那么些插件。放心安装,因为Firefox是一款开源的浏览器。相信开源软件。

jQuery处理键盘事件有多少个函数,遵照事件发生的次第分别是:

复制代码 代码如下:

keydown();
keyup();
keypress();

keydown()

keydown事件会在键盘按下时接触,能够在绑定的函数中欧可以回到false来防备触发浏览器的暗许事件.

keyup()

keyup事件会在按键释放时接触,也正是您按下键盘起来后的事件

keypress()

keypress事件会在敲击按键时接触,大家得以知晓为按下并抬起同三个按键

 大家怎么才能获得自作者按下的是A仍然Z如故回车按钮呢?

键盘事件能够传递八个参数event,其实说有的jQuery事件函数中都能够传递这么八个参数

复制代码 代码如下:

$(‘input’).keydown(function(event){
alert(event.keyCode);
});

地点代码中的,event.keyCode就足以扶持我们得到到我们按下了怎么着按键,他回去的是ascII码,比如说上下左右键,分别是38,40,37,39

万一大家要兑现ctrl+Enter正是ctrl+回车提交表单

复制代码 代码如下:

$(document).keypress(function(e) {
if (e.ctrlKey && e.which == 13)
$(“form”).submit();
})

其余参考音讯:

准备知识

1.数字0键值48..数字9键值57
2.a键值97..z键值122;A键值65..Z键值90
3.+键值43;-键值45;.键值46;退格8;tab键值9;
4.event在ie中是全局的,在firefox是最近对象,须求传递参数

复制代码 代码如下:

*/
jQuery.extend({
/*===========================================================================
成效描述:取得按键的值
调用方法:
jQuery.getKeyNum(event);
*/
getKeyNum:function(e){
var keynum;
if(window.event){ // IE
keynum = event.keyCode;
}
else if(e.which){ // Netscape/Firefox/Opera
keynum = e.which;
}
return keynum;
},
/*===========================================================================
意义描述:判断是还是不是是整数,限制编辑框只可以输入数字
调用方法:
<input type=”text” onkeypress=”return jQuery.isInt(event);” />
待化解难点:
firefox下tab键不起效用。
*/
isInt:function(e){
var keynum = this.getKeyNum(e);
if(keynum >= 48 && keynum <= 57 || keynum ==
8){//firefox下退格需判断8
return true;
}
return false;
},
/*===========================================================================
功效描述:判断是不是是小数,限制编辑框只好输入数字,只好输入叁个小数点。
调用方法:
<input type=”text” onkeypress=”return jQuery.isFloat(this,event);”
/>
*/
isFloat:function(txt,e){
var keynum = this.getKeyNum(e);
if(keynum == 46){//输入小数点
if(txt.value.length == 0){
return false;
}else if(txt.value.indexOf(‘.’) >= 0){
return false;
}else{
return true;
}
}
if(this.isInt(e)){
return true;
}
return false;
}
});

您恐怕感兴趣的小说: