jQuery事件

focus获得焦点事件

当元素获得焦点时，触发 focus 事件。

focusin(当元素获得焦点时，触发 focusin 事件当元素失去焦点时触发 focusout 事件。focusin事件跟blur事件区别在于，他可以在父元素上检测子元素失去焦点的情况)

focusout(当元素失去焦点时触发 focusout 事件。focusout事件跟blur事件区别在于，他可以在父元素上检测子元素失去焦点的情况)

$(document).ready(function(){
  $("#login").focus();
});//当dom就绪开始页面时,执行函数使元素login获得焦点

$('input[type=text]').focus(function(){
$(this).blur();
});//当文本框获得焦点使执行函数是这个文本框消失

blur 失去焦点事件

当元素失去焦点时触发 blur 事件。

data:blur([Data], function) 可传入data供函数function处理。

function:在每一个匹配元素的blur事件中绑定的处理函数。

$("p").blur(function(){
$('#div1').css('color','yellow')
​
});//当所有段落失去焦点后执行函数给元素div1加个红色

 

鼠标事件

mousedown:当鼠标指针移动到元素上方，并按下鼠标按键时，会发生 mousedown 事件。

mouseup:当在元素上放松鼠标按钮时，会发生 mouseup 事件。

mouseleave:当鼠标指针离开元素时，会发生 mouseleave 事件。该事件大多数时候会mouseenter 事件一起使用。

mouseout:当鼠标指针从元素上移开时，发生 mouseout 事件。

mousseenter:当鼠标指针穿过元素时，会发生 mouseenter 事件。该事件大多数时候会mouseleave 事件一起使用。

mouseover:当鼠标指针位于元素上方时，会发生 mouseover 事件。

$('p').mousedown(function(){
$(this).css('color','red')
});//当鼠标按下时执行函数使p段落变颜色

resize调整事件:

当调整浏览器窗口的大小时，发生 resize 事件。

$(window).resize(function(){
alert('stop!')
});//当调整窗口大小的时候,弹出页面停

scroll鼠标滚动事件:

当用户滚动指定的元素时，会发生 scroll 事件。

$("div").scroll(function() {
  $("span").text(x+=1);
});//对元素滚动的次数进行计数：

select选择事件:

当 textarea 或文本类型的 input 元素中的文本被选择时，会发生 select 事件。

这个函数会调用执行绑定到select事件的所有函数，包括浏览器的默认行为。可以通过在某个绑定的函数中返回false来防止触发浏览器的默认行为。

$(":text").select( function () { /* ...do something... */ } );//当所有文本框中文本被选中时执行函数

submit提交事件

$('form').submit(function(){
return false
});//当表单被提交时执行函数使提交错误

键盘事件

keydown,keypress,keyup

当键盘或按钮被按下时，发生 keydown 事件。

注释：如果在文档元素上进行设置，则无论元素是否获得焦点，该事件都会发生

$(window).keydown(function(event){
  switch(event.keyCode) {
    // ...
    // 不同的按键可以做不同的事情
    // 不同的浏览器的keycode不同
    // 更多详细信息:     https://unixpapa.com/js/key.html
    // 常用keyCode： 空格 32   Enter 13   ESC 27
  }
});

change 验证事件

当元素的值发生改变时，会发生 change 事件。

$("input[type='text']").change( function() {
  // 这里可以写些验证代码
});//给所有的input输入验证
click点击事件:

click单击

dbclick双击

点击触发每一个匹配元素的click事件。

这个函数会调用执行绑定到click事件的所有函数

$("p").dbclick( function () {
    $(this).hide(); 
         });//双击段落p后执行函数把这些段落(this)隐藏