Javascript和jquery事件--鼠标事件的小结

1、鼠标事件的主要事件应该是mouseup, mousedown, mousewheel, mousemove, mouseover, moveout。

 　　<1>其中mouseup和mousedown组成了单击(click)，双击(dblclick)事件，或许还有拖拽事件，不过我还没有涉及到。表单事件上的foucs,blur事件应该也与之相关。

           　　在一类事件里面我们主要关注点击的是鼠标哪个键e.whick/e.button

　　<2>mousewheel是鼠标滚轮事件，与浏览器默认的滚动条事件相关，关注的是滚轮方向是向上还是向下event.wheelDelta/e.detail

　　<3> mousemove是鼠标移动事件，不常用。

　　　　关注的是鼠标位置和鼠标移动方向movementX和 movementY

　　<4>mouseover, moveout是鼠标移入移出事件，在js的冒泡模式中很大的副作用，需要自定义成hover事件，或者使用jq。关注触发的元素target/srcElement和绑定事件的元素currentTarget，以及目标元素toElement/fromElement/ relatedTarget。

 

2、  事件监听器在js和jq的不同表现

　　Jq兼容了js在不同浏览器的写法，也对一些js的副作用做了改进（mouseenter, mouseleave, hover）。

　　<1>标准监听写法

　　　　也就是js的target.addEventListener()和jq的四种监听器on,bind,live, delegate绑定写法。在这种写法中，jq一般都支持js命名的事件，jq也有一些自定义的事件。

　　<2>on-type

         　　onclick,ondblcick这种写法可以写在html中，或者当作属性来设置，js和jq都支持，但是js支持以下写法而jq不支持。

 

document.getElementById('c1').onmousemove=showit;

$('#c2').onmousemove=showit;//无效

<3>函数

click(),mousemove()等等函数绑定监听事件在jq里面都有定义，但是在js中大多没有。但是click()在js中可以用来触发点击事件。