JQuery常用动态效果事件

jQuery事件是对JavaScript事件的封装

基础事件

  • window事件
  • ready(fn)?
鼠标事件
  • click(fn)?单击鼠标
  • mouseover(fn) 鼠标移过时
  • mouseout(fn) 鼠标移出时
键盘事件
  • keydown(fn) 键盘按下时
  • keyup(fn) 键盘释放时
  • keypress(fn)?产生可打印的字符时
表单事件
  • focus(fn) 获得焦点时
  • blur(fn) 失去焦点时
  • submit(fn)?表单提交时

复合事件是多个事件的组合 ?

鼠标光标悬停
  • hover(fn1,fn2)方法

    • 相当于mouseover与mouseout事件的组合
$("#parentMenu").hover( function() {
$("#childMenu").css("display","block");  //mouseover
},
function() {
$("#childMenu").css("display","none");  // mouseout
}
);
  • 鼠标连续点击

    • toggle()方法用于模拟鼠标连续click事件
$("body").toggle( 
function () { },   // 第1,4,7…次点击时触发 
function () { },  // 第2,5,8..次点击时触发 
function () { }   // 第3,6,9…次点击时触发
);
  • bind()方法 - 事件绑定

    • $(selector).bind( type [, data] , fn )
    • $("#btn").bind( "click" , fn );
  • unbind()方法 – 解除事件绑定

    • $(selector). unbind( )
    • $("# btn"). unbind()
    • $("# btn"). unbind( "click" )
    • $("# btn"). unbind( "click" , handler );
  • on()方法 - 事件绑定

    • $(selector).on( events [, selector] [, data] , fn )
    • $("#form").on( "click" , ".btn" , {} , fn );
  • off()方法 – 解除事件绑定

    • $(selector). off( events, [selector], [handler] )
    • $(selector). off( events, [selector] )
    • $(selector). off( events )
    • $(selector). off()
Last modification:December 14th, 2017 at 11:53 pm
If you think my article is useful to you, please feel free to appreciate

Leave a Comment