jquery中事件
事件
ready 页面载入
在同一个页面中无限次地使用$(document).ready()事件。其中注册的函数会按照（代码中的）先后顺序依次执行。
$(document).ready(function () { // 在这里写你的代码... });
on
on()方法绑
$('#div1').on('mousemove', function () { //鼠标移动上去后弹出move
alert('move')
})
$('#div1').on('mousedown', function () { //鼠标按下后弹出down
alert('down')
})
定事件处理程序到当前选定的jQuery对象中的元素。
off 移除
off() 方法移除用.on()绑定的事件处理程序
$('#div1').off('mousedown')//选中单个
$('#div1').off('mousedown', 'mousemove')//多个,都有才能选中
one
one 只运行一次，然后删除自己，
$('ul').one('mousedown', function () {
console.log('ulmove')
})//点击ul后出现 ulmove ,之后在点无效果
change 改变
当元素的值发生改变时，会发生 change 事件。
该事件仅适用于文本域（text field），以及 textarea 和 select 元素。当用于 select 元素时，change 事件会在选择某个选项时发生。当用于 text field 或 text area 时，该事件会在元素失去焦点时发生。
$(selector).change(); or $("input[type='text']").change( function() { // 这里可以写些验证代码 });
click 点击
jQuery 代码:
$("p").click();
将页面内所有段落点击后隐藏。
$("p").click( function () { $(this).hide(); });
dblclick 双击
给页面上每个段落的双击事件绑上 "Hello World!" 警告框
jQuery 代码:
$("p").click( function () { $(this).hide(); });
mousemove 鼠标移动
获得鼠标指针在页面中的位置：
$(document).mousemove(function(e){
$("span").text(e.pageX + ", " + e.pageY);
});
focus 获得焦点1
当页面加载后将 id 为 'login' 的元素设置焦点:
jQuery 代码:
$(document).ready(function(){ $("#login").focus(); });
使人无法使用文本框:
jQuery 代码:
$("input[type=text]").focus(function(){
this.blur();
});//得到焦点后失去焦点
focusin 获得焦点2
跟focus事件区别在于，他可以在父元素上检测子元素获取焦点的情况。
获得焦点后会触发动画:
HTML 代码:
<p><input type="text" /> <span>focusout fire</span></p> <p><input type="password" /> <span>focusout fire</span></p>
jQuery 代码:
$("p").focusin(function() {
$(this).find("span").css('display','inline').fadeOut(1000);
});
blur 失去焦点1
当元素失去焦点时触发 blur 事件。
这个函数会调用执行绑定到blur事件的所有函数，包括浏览器的默认行为。可以通过返回false来防止触发浏览器的默认行为。blur事件会在元素失去焦点的时候触发，既可以是鼠标行为，也可以是按tab键离开的
$('input[type="text"]').blur(function ()
{
$('#div1').css('color', 'red')//单行css样式
$('#div1').css({ //多行css样式
'color': 'red',
'background': 'lightblue',
' width': '100px'
})
})//text框失去焦点时div1颜色变红
focusout 失去焦点2
失去焦点后会触发动画:
跟blur 事件区别在于，他可以在父元素上检测子元素失去焦点的情况。
HTML 代码:
<p><input type="text" /> <span>focusout fire</span></p> <p><input type="password" /> <span>focusout fire</span></p>
jQuery 代码:
$("p").focusout(function() {
$(this).find("span").css('display','inline').fadeOut(1000);
});//this 指 p,谁调用谁是this
keydown 键盘/按钮按下1
在页面内对键盘按键做出回应，可以使用如下代码:
jQuery 代码:
$(window).keydown(function(event){ switch(event.keyCode) { // ... // 不同的按键可以做不同的事情 // 不同的浏览器的keycode不同 // 更多详细信息: https://unixpapa.com/js/key.html // 常用keyCode： 空格 32 Enter 13 ESC 27 } });
keypress 键盘/按钮按下2
与 keydown 事件不同，每插入一个字符，就会发生 keypress 事件.
keyup 按钮松开
它发生在当前获得焦点的元素上。
当按下按键时，改变文本域的颜色：
$("input").keyup(function(){
$("input").css("background-color","#D6D6FF");
});
mousedown 按下鼠标
当按下鼠标按钮时，隐藏或显示元素：
$("button").mousedown(function(){
$("p").slideToggle();
});
mouseenter a鼠标指针只穿选中的
大多数时候会与mouseleave 事件一起使用。
与 mouseover 事件不同，只穿被选中的
当鼠标指针进入（穿过）元素时，改变元素的背景色：
$("p").mouseenter(function(){
$("p").css("background-color","yellow");
});
mouseleave a 鼠标指针离开选中元素a
只离开被选中的时
当鼠标指针离开元素时，改变元素的背景色：：
$("p").mouseleave(function(){
$("p").css("background-color","#E9E9E4");
});
mouseover b鼠标指针位于元素上方
多与
穿过被选元素或其子元素，都会触发 mouseover 事件。
当鼠标指针位于元素上方时时，改变元素的背景色：
$("p").mouseover(function(){
$("p").css("background-color","yellow");
});
mouseout b 鼠标离开任何元素
离开被选元素还是任何子元素，都会触发 mouseout 事件。
当鼠标从元素上移开时，改变元素的背景色：
$("p").mouseout(function(){
$("p").css("background-color","#E9E9E4");
});
mouseup 放松鼠标按钮
与 click 事件不同，mouseup 事件仅需要放松按钮。当鼠标指针位于元素上方时，放松鼠标按钮就会触发该事件。
相当于放上
当松开鼠标按钮时，隐藏或显示元素：
resize 调整窗口
$("button").mouseup(function(){
$("p").slideToggle();
});
当调整浏览器窗口的大小时，发生 resize 事件。
让人每次改变页面窗口的大小时很郁闷的方法:
$(window).resize(function(){ alert("Stop it!"); });
scroll 滚动指定的元素
当页面滚动条变化时，执行的函数:
$(window).scroll( function() { /* ...do something... */ } );
对元素滚动的次数进行计数：
$("div").scroll(function() {
$("span").text(x+=1);
});
select 执行绑定到select
当 textarea 或文本类型的 input 元素中的文本被选择时，会发生 select 事件。
这个函数会调用执行绑定到select事件的所有函数，包括浏览器的默认行为。可以通过在某个绑定的函数中返回false来防止触发浏览器的默认行为。
触发所有input元素的select事件:
$("input").select();
当文本框中文本被选中时执行的函数:
$(":text").select( function () { /* ...do something... */ } );
submit 提交表单
提交本页的第一个表单:
$("form:first").submit();
如果你要阻止表单提交
$("form").submit( function () {
return false;
} );
