首页 > 代码库 > JS事件用法

JS事件用法

1.常用事件理解

技术分享

onfocus/onblur:聚焦离焦事件,用于表单校验的时候比较合适。

onclick/ondblclick:鼠标单击和双击事件

onkeydown/onkeypress:搜索引擎使用较多

onload:页面加载事件,所有的其它操作(匿名方式)都可以放到这个绑定的函数里面去。如果是有名称,那么在html页面中只能写一个。

onmouseover/onmouseout/onmousemove:购物网站商品详情页。

onsubmit:表单提交事件 ,有返回值,控制表单是否提交(只能在form标签内)。

onchange:当用户改变内容的时候使用这个事件(二级联动)

 

2.第二种理解方式

技术分享

 

3.键盘事件的用法

根据按下的 键确认相应的事件

1.

$("#ss").keyup(function(xxx){            //将浏览器产生的事件对象设置到myevent变量中            var myevent = xxx;            //获取按键的unicode编码            var code = myevent.keyCode;            //如果按钮是回车            if(code == 13){                //获取数字微调的当前值,因为$(this)此时表示的是文本框,直接获取value属性值即可                var value = http://www.mamicode.com/$(this).val();"#num").text(value).css("color","red");                }        });

 

 

2.

$(document).keydown(function(even){   //键盘事件,键盘对应的码可以参考网站http://unixpapa.com/js/key.html        /*******按键不是39的时候变换方向,先移除原来的CSS属性增加新的class属性,CSS中先定义好class属性*****/        if(even.keyCode!=keyrecord){$bird.removeClass().addClass("dir_"+even.keyCode);}//删除原来的属性后增加新的class属性        keyrecord=even.keyCode;        switch(even.keyCode){            case 37://左移//            alert(pos.left);   //显示出小鸟的距离左边位移            pos.left-=10;            if(pos.left<=-birdsSize.width){pos.left=$(window).width();} //如果左移的位置超过小鸟宽度,设置为从右边出来。            break;                        case 38://上移            pos.top-=10;            if(pos.top<=-birdsSize.height){pos.top=$(window).height();} //如果上移的位置超过小鸟负高度,设置为从下边出来。            break;                        case 39://右移            pos.left+=10;            if(pos.left>=$(window).width()){pos.left=-birdsSize.width;} //如果右移的位置超过屏幕宽度,设置为从左边出来。            break;                        case 40://下移            pos.top+=10;            if(pos.top>=$(window).height()){pos.top=-birdsSize.height;} //如果下移的位置超过屏幕宽度,设置为从上边出来。            break;                                }

 

JS事件用法