jQuery事件总结

jQuery事件总结

开发工具与关键技术：VisualStudio2015  jQuery
作者：唐文坚
撰写时间：2020年5月1日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~jQuery页面载入事件：
JQ的页面载入事件要比JS的代码量少。
两个方法写页面加载事件：
$(document).reday(function(){要写的代码})这个写发较为麻烦、
$(function(){要写的代码})这写法就是页面加载事件的简写形式，直接在括号里写函数代码
获焦与失焦事件：
Focus（）：
这个事件就是在鼠标点击一个文本框的时候触发的事件
列：(".wrap input").focus(function () {
            console.log("input已经获取到了焦点");
        });
Blur（）：
在鼠标点击到文本框后又又点击到别的地方时触发的事件
列：(".wrap input"). Blur (function () {
            console.log("input已经失去了焦点");
        });
Focusin()：
在元素获取到焦点的时候父元素也会检测到
列：$(".wrap").focusin(function () {
            $(this).addClass("bgPink");
        });
Focusout():
在元素失去焦点的·时候父元素也会检测到
列：$(".wrap"). Focusout (function () {
            $(this).removeClass("bgPink");
        });
Change（）事件：
Chang事件当元素的值发生改变时，会发生 change 事件。
该事件仅适用于文本域（text field），以及 textarea 和 select 元素。当用于 select 元素时，change 事件会在选择某个选项时发生。当用于 text field 或 text area 时，该事件会在元素失去焦点时发生。
列：$("form input").change(function (event) 
            console.log(event.target.value);
        });
        $("form select").change(function () {
            var value = $(this).val();
            console.log(value);
        });
        $("form textarea").change(function () {
            console.log(event.target.value);
        });
submit()事件：
一个表单提交事件，如果想阻止表单的提交
列：
         $("form").submit( function () {
                return false;
            } );

event.pageX 和 event.pageY：获取鼠标当前相对于页面的坐标
event.preventDefault() 方法：阻止默认行为
  event.stopPropagation() 方法：阻止事件冒泡
event.which：获取在鼠标单击时，单击的是鼠标的哪个键
event.currentTarget : 在事件冒泡过程中的当前DOM元素
this和event.target的区别：
                js中事件是会冒泡的，所以this是可以变化的，但event.target不会变化，它永远是直接接受事件的目标DOM元素；
            .this和event.target都是dom对象
                如果要使用jquey中的方法可以将他们转换为jquery对象。比如this和$(this)的使用、event.target和$(event.target)的使用；