jQuery-（3）事件

什么是事件？

页面对不同访问者的响应叫做事件。

• 在元素上移动鼠标。
• 选取单选按钮
• 点击元素

---

常用的事件

（1）click()
click() 方法是当按钮点击事件被触发时会调用一个函数。

$("p").click(function(){
  $(this).hide();
});

（2）dblclick()
当双击元素时，会发生 dblclick 事件。

$("p").dblclick(function(){
  $(this).hide();
});

（3）mouseenter()
当鼠标指针穿过元素时，会发生 mouseenter 事件。

$("#p1").mouseenter(function(){
    alert('您的鼠标移到了 id="p1" 的元素上!');
});

（4）mouseleave()
当鼠标指针离开元素时，会发生 mouseleave 事件。

$("#p1").mouseleave(function(){
    alert("再见，您的鼠标离开了该段落。");
});

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

$("#p1").mousedown(function(){
    alert("鼠标在该段落上按下！");
});

（6）mouseup()
当在元素上松开鼠标按钮时，会发生 mouseup 事件。

$("#p1").mouseup(function(){
    alert("鼠标在段落上松开。");
});

（7）hover()
hover()方法用于模拟光标悬停事件。

$("#p1").hover(
    function(){
        alert("你进入了 p1!");
    },
    function(){
        alert("拜拜! 现在你离开了 p1!");
    }
);

（8）focus()
当元素获得焦点时，发生 focus 事件。

$("input").focus(function(){
  $(this).css("background-color","#cccccc");
});

（9）blur()
当元素失去焦点时，发生 blur 事件。

$("input").blur(function(){
  $(this).css("background-color","#ffffff");
});