JavaScript事件

jQuery鼠标事件

1. click() 鼠标单击事件 // js onclick
   click单击事件
   $(".box").click(function () {
   alert(“这是一个click单击事件被触发了”)
   });

2. dblclick() 鼠标双击事件 // js ondblclick
   dblclick鼠标双击事件
   $(".box").dblclick(function () {
   (“这是一个dblclick鼠标双击事件被触发了”)
   });

3. mousedown() 当鼠标指针移动到元素上方，并按下鼠标按键时，会发生mousedown事件
   mousedown 鼠标移动到某个元素上被按下的时候触发的事件
   $(".box").mousedown(function () {
   alert(“这是一个mousedown鼠标被按下的时候触发”);
   });

4. mouseup() 当在元素上放松鼠标按钮时，会发生 mouseup 事件。
   mouseup当在元素上放松鼠标按钮时
   $(".box").mouseup(function () {
   alert(“这是一个mouseup当在元素上放松鼠标按钮时触发的事件”);
   });

5. mouseenter() 当鼠标指针穿过元素时，会发生mouseenter事件。该事件大多数时候会与mouseleave 事件一起使用。
   mouseenter事件
   $(".box").mouseenter(function () {
   console.log(“mouseenter”);
   });

6. mouseleave() 当鼠标指针离开元素时，会发生 mouseleave 事件。该事件大多数时候会与mouseenter 事件一起使用
   mouseleave事件
   $(".box").mouseleave(function () {
   console.log(“mouseleave”);
   });

7.mouseover() 当鼠标指针位于元素上方时，会发生 mouseover 事件。该事件大多数时候会与 mouseout 事件一起使用
mouseover事件
$(".box").mouseover(function () {
console.log(“mouseover”);
});
8.mouseout() 当鼠标指针从元素上移开时，发生 mouseout 事件。该事件大多数时候会与 mouseover 事件一起使用
mouseout
$(".box").mouseout(function () {
console.log(“mouseout”);
});
9. mousemove() 当鼠标指针在指定的元素中移动时，就会发生 mousemove 事件。
mousemove事件处理函数会被传递一个变量——事件对象，其.clientX 和 .clientY 属性代表鼠标的坐标
注意！！！
mouseover与mouseenter的区别：
mouseover如果鼠标指针穿过选定元素的任何子元素，都会触发mouseover事件，
mouseenter如果鼠标指针穿过选定元素的任何子元素不会触发mouseenter事件
mouseout与mouseleave的区别：
mouseout不论鼠标指针离开被选元素还是任何子元素，都会触发mouseout事件。
mouseleave只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件
简而言之：就是移动到选定元素的子元素上面是否触发事件
mouseover 子元素 触发
mouseenter 子元素 不触发
mouseout 子元素 触发
mouseleave 子元素 不触发

jQuery表单事件

1. focus() 事件
   当元素获得焦点时，触发focus事件。可以通过鼠标点击或者键盘上的TAB导航触发。这将触发所有绑定的focus函数
   例如：$(".wrap input").focus(function () {
   console.log(“input已经获取到了焦点”);
   });

2. blur() 事件
   当元素失去焦点时触发 blur 事件。
   这个函数会调用执行绑定到blur事件的所有函数，包括浏览器的默认行为。可以通过返回false来防止触发浏览器的默认行为。blur事件会在元素失去焦点的时候触发，既可以是鼠标行为，也可以是按tab键离开的
   例如：$(".wrap input").blur(function () {
   console.log(“input已经失去了焦点”);
   });

3. focusin() 事件
   当元素获得焦点时，触发 focusin 事件。
   focusin事件跟focus事件区别在于，他可以在父元素上检测子元素获取焦点的情况。
   例如：$(".wrap").focusin(function () {
   $(this).addClass(“bgPink”);
   });

4. focusout() 事件
   当元素失去焦点时触发 focusout 事件。
   focusout事件跟blur事件区别在于，他可以在父元素上检测子元素失去焦点的情况
   例如：$(".wrap").focusout(function () {
   $(this).removeClass(“bgPink”);
   });

5.事件对象：Query事件对象的属性和方法
事件对象的属于与方法有很多，但是我们经常用的只有那么几个，这里我主要说下作用与区别
event.type：获取事件的类型
触发元素的事件类型
$("a").click(function(event)alert(event.type);//"click"事件);event.pageX和event.pageY：获取鼠标当前相对于页面的坐标通过这2个属性，可以确定元素在当前页面的坐标值，鼠标相对于文档的左边缘的位置（左边）与（顶边）的距离，简单来说是从页面左上角开始,即是以页面为参考点,不随滑动条移动而变化event.preventDefault()方法：阻止默认行为这个用的特别多，在执行这个方法后，如果点击一个链接（a标签），浏览器不会跳转到新的URL去了。我们可以用event.isDefaultPrevented()来确定这个方法是否(在那个事件对象上)被调用过了event.stopPropagation()方法：阻止事件冒泡事件是可以冒泡的，为防止事件冒泡到DOM树上，也就是不触发的任何前辈元素上的事件处理函数event.which：获取在鼠标单击时，单击的是鼠标的哪个键event.which将event.keyCode和event.charCode标准化了。event.which也将正常化的按钮按下(mousedown和mouseupevents)，左键报告1，中间键报告2，右键报告3event.currentTarget:在事件冒泡过程中的当前DOM元素冒泡前的当前触发事件的DOM对象,等同于this.this和event.target的区别：js中事件是会冒泡的，所以this是可以变化的，但event.target不会变化，它永远是直接接受事件的目标DOM元素；.this和event.target都是dom对象如果要使用jquey中的方法可以将他们转换为jquery对象。比如this和$(this)的使用、event.target和$(event.target)的使用；
jQuery键盘事件
鼠标有mousedown,mouseup之类的事件，这是根据人的手势动作分解的2个触发行为。
相对应的键盘也有这类事件，将用户行为分解成2个动作，键盘按下与松手，针对这样的2种动作，
jQuery分别提供了对应keydown与keyup方法来监听

        - keydown()事件
            当键盘或按钮被按下时，发生keydown事件。
        - keyup()事件
            当按钮被松开时，发生keyup事件。它发生在当前获得焦点的元素上。

例如：
$(".target2").keyup(function (e) {
$(“em:last”).text(e.target.value);
});

2jQuery键盘事件 keypress()事件
在input元素上绑定keydown事件会发现一个问题：
注意：每次获取的内容都是之前输入的，当前输入的获取不到

       keydown事件触发在文字还没敲进文本框，这时如果在keydown事件中输出文本框中的文本，
       得到的是触发键盘事件前的文本，而keyup事件触发时整个键盘事件的操作已经完成，
       获得的是触发键盘事件后的文本

       当浏览器捕获键盘输入时，还提供了一个keypress的响应，这个跟keydown是非常相似

       keypress事件与keydown和keyup的主要区别
            只能捕获单个字符，不能捕获组合键
            无法响应系统功能键（如delete，backspace）
            不区分小键盘和主键盘的数字字符
            总而言之，

        KeyPress主要用来接收字母、数字等ANSI字符，
        而 KeyDown 和 KeyUP 事件过程可以处理任何不被 KeyPress 识别的击键。
        诸如：功能键（F1-F12）、编辑键、定位键以及任何这些键和键盘换档键的组合等。