主要记录在菜鸟上学习的内容:平时可能会用到但是不太熟悉的内容——做记录之用。
-
鼠标事件
- click() 点击元素
$("p").click(function(){
// 动作触发后执行的代码!
});
- dblclick() 双击元素
$("p").dblclick(function(){
$(this).hide();//双击隐藏p元素
});
- mouseenter() 鼠标指针穿过元素时
- mouseleave() 鼠标指针离开元素时
- mousedown() 鼠标指针移动到元素上方,并按下鼠标按键时
- mouseup() 在元素上松开鼠标按钮时
- hover() 鼠标移动到元素上时,悬停事件
$("#p1").hover(
function(){
alert("你进入了 p1!");//进入元素时
},
function(){
alert("拜拜! 现在你离开了 p1!");//退出元素时
}
);
- focus() 元素获得焦点时,通过鼠标点击选中元素或通过 tab 键定位到元素时,该元素就会获得焦点。
$("input").focus(function(){
$(this).css("background-color","#cccccc");//获取焦点时,变色
});
- blur() 元素失去焦点时
-
键盘事件
- keypress() 当按钮被按下时,会发生该事件。它发生在当前获得焦点的元素上。
i=0;
$(document).ready(function(){
$("input").keypress(function(){//计算input输入框中的按键次数
$("span").text(i+=1);
});
});
...
<body>
Enter your name: <input type="text" />
<p>Keypresses:<span>0</span></p>
</body>
- keydown() 完整的 key press 过程分为两个部分:1. 按键被按下;2. 按键被松开。
当按钮被按下时,发生 keydown 事件。 - keyup() 当按钮被松开时,发生 keyup 事件。
-
表单事件
- submit() 当提交表单时,会发生 submit 事件。该事件只适用于表单元素。
语法:
$(selector).submit(function)
- change() 当元素的值发生改变时,会发生 change 事件。该事件仅适用于文本域(text field),以及 textarea 和 select 元素。
语法:
$(selector).change()
- focus() 当元素获得焦点时,发生 focus 事件。当通过鼠标点击选中元素或通过 tab 键定位到元素时,该元素就会获得焦点。
语法:
$(selector).focus()
- blur() 当元素失去焦点时发生 blur 事件。
语法:
$(selector).blur()
-
文档/窗口事件
- load() 当指定的元素(及子元素)已加载时,会发生 load() 事件。该事件适用于任何带有 URL 的元素(比如图像、脚本、框架、内联框架)。
语法:$(selector).load(function)
- resize() 当调整浏览器窗口的大小时,发生 resize 事件。
语法:$(selector).resize(function)
- scroll() 当用户滚动指定的元素时,会发生 scroll 事件。scroll 事件适用于所有可滚动的元素和 window 对象(浏览器窗口)。
语法:$(selector).scroll()
- unload() 当用户离开页面时,会发生 unload 事件。
具体来说,当发生以下情况时,会发出 unload 事件:
-点击某个离开页面的链接
-在地址栏中键入了新的 URL
-使用前进或后退按钮
-关闭浏览器
-重新加载页面
语法:event.unload(function)