jquery事件

2019-01-11  本文已影响5人  极客_Ls
页面对不同访问者的响应叫做事件。

在事件中经常使用术语"发"(或"激发")例如: "当您按下按键时触发 keypress 事件"。

常见 DOM 事件:

鼠标事件 键盘事件 表单事件 文档/窗口事件
click keypress submit load
dbclick keydown change resize
mouseenter keyup focus scroll
mouseleave blur unload

鼠标事件

  1. click

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

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

当双击元素时,会发生 dblclick 事件。

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

当鼠标指针穿过元素时,会发生 mouseenter 事件。

$("#p1").mouseenter(function(){ 
  alert("You entered p1!"); 
});
  1. mouseleave

当鼠标指针离开元素时,会发生 mouseleave 事件。

$("#p1").mouseleave(function(){ 
  alert("Bye! You now leave p1!"); 
});
  1. mousedown

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

$("#p1").mousedown(function(){ 
  alert("Mouse down over p1!"); 
});
  1. mouseup

mouseup() 方法触发 mouseup 事件,或规定当发生 mouseup 事件时运行的函数:

$("#p1").mouseup(function(){ 
  alert("Mouse up over p1!"); 
});
  1. hover

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

$("#p1").hover(function(){ 
    $(this).css("color","red");
  }, 
  function(){ 
    $(this).css("color","black"); 
});
  1. focus

当元素获得焦点时,发生 focus 事件。

 $("input").focus(function(){
    $(this).css("color","red");
  });
  1. blur

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

 $("input").blur(function(){
    $(this).css("color","black");
  });
比较keypress、keydown与keyup
上一篇下一篇

猜你喜欢

热点阅读