jQuery中的事件

加载DOM

在页面加载完毕后, 浏览器会通过 JavaScript 为 DOM 元素添加事件. 在常规的 JavaScript 代码中, 通常使用 window.onload 方法, 在 jQuery 中使用 $(document).ready() 方法

$(document).ready(function(){});
//简化为
$(function(){});

事件绑定

对匹配的元素进行特定的事件绑定: bind()

$(".head").click(function(){});
//绑定写法为
$(".head").bind("click", function(){});

合成事件

hover()：模拟光标悬停事件

• 当光标移动到元素上时, 会触发指定的第一个函数, 当光标移出这个元素时, 会触发指定的第二个函数.

(".head").mouseover(function(){
	$(".content").show();
}).mouseout(function(){
	$(".content").hide();
});
//使用合成事件
$(".head").hover(function(){
	$(".content").show();
}, function(){
	$(".content").hide();
});

toggle()：用于模拟鼠标连续单击事件

• 第一次单击元素, 触发指定的第一个函数, 当再一次单击同一个元素时, 则触发指定的第二个函数, 如果有更多个函数, 则依次 触发, 直到最后一个
• toggle() 的另一个作用：切换元素的可见状态

$(".head").toggle(function(){
	$(".content").show();
}, function(){
	$(".content").hide();
});