jQuery事件总结 ——对jquery的基本操作

1.绑定事件
(1)

$( " p " ).bind( " click " , function(e) {} );


(2)

$( " p " ).click(function() {} )


2.删除事件

(1)删除特定事件

$( " div " ).unbind( " click " );


(2)删除所有事件

$( " div " ).unbind();


3.触发事件

(1)trigger方法 触发特定元素事件

$( " div " ).trigger( ' click ' );

(2)triggerHandler方法 与trigger方法相似,但不触发浏览器默认事件,如focus事件,使用此方法,将会阻止焦点到元素上

$( " input " ).triggerHandler( " focus " );


4.特殊事件
(1)one(string event,function data)
此事件只执行一次则被删除

$( " p " ).one( " click " , function() {
   alert(
"test");
}
);


(2)hover(over, out)
切换mouseover与mouseout事件

$( " td " ).hover(
   function ()
{
     $(
this).addClass("hover");
   }
,
   function ()
{
     $(
this).removeClass("hover");
   }

);

可用unbind mouseover与mouseout方法来删除此事件
(3)toggle(oldclick,newclick)
切换执行click事件

     $( " li " ).toggle(
       function ()
{
         $(
this).css("list-style-type", "disc")
                .css(
"color", "blue");
       }
,
       function ()
{
         $(
this).css({"list-style-type":"", "color":""});
       }

     );


可用unbind click方法来删除此事件

5.     1.2.3版本新增功能
(1)事件命名空间(便于管理)

实际使用方面:
1.当不需要全部事件,删除特定2个以上的事件.

示例:

   $( " div " ).bind( " click.plugin " ,function() {} );
   $(
" div " ).bind( " mouseover.plugin " , function() {} );
   $(
" div " ).bind( " dblclick " , function() {} );
   $(
" button " ).click(function() {$("div").unbind(".plugin");   } )


在事件名称后面加命名空间,在删除事件时,只需要指定命名空间即可.以上代码执行以后,dbclick仍然存在.

(2)相同事件名称,不同命名的事件执行方法

示例:

$( " div " ).bind( " click " , function() { alert("hello"); } );
   $(
" div " ).bind( " click.plugin " , function() { alert("goodbye"); } );
   $(
" div " ).trigger( " click! " ); // alert("hello") only


以上trigger方法则根据事件名称来执行事件.

简单的写几句.以上的几个方法还是非常实用方便的

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值