JQuery中的事件 (八.其他用法)

来源：互联网发布：淘宝店主风调色滤镜编辑：程序博客网时间：2024/05/21 08:00

1.绑定多个事件类型bind("mouseover mouseout",...)

  <style>  div{width:100px;height:50px;  }  .over{  color:red;  background:#888;  }   </style>  <script type="text/javascript">  $(function(){     $("div").bind("mouseover mouseout", function(){        $(this).toggleClass("over");     });  })  </script></head><body><div >滑入.</div></body>

2.添加时间命名空间,便于管理

 <style>div{width:100px;height:50px;background:#888;color:white;} </style>  <script type="text/javascript">  $(function(){$("div").bind("click.plugin",function(){       $("body").append("<p>click事件</p>");});$("div").bind("mouseover.plugin", function(){       $("body").append("<p>mouseover事件</p>");});$("div").bind("dblclick", function(){   $("body").append("<p>dblclick事件</p>");});$("button").click(function() {$("div").unbind(".plugin");  })/*click,mouseover 事件被删除，*/  })  </script></head><body><div>test.</div><button >根据命名空间，删除事件</button></body>

3.相同事件名称,不同命名空间执行方法,!执行除去命名空间的点击事件

 <style>div{width:100px;height:50px;background:#888;color:white;} </style>  <script type="text/javascript">  $(function(){$("div").bind("click",function(){       $("body").append("<p>click事件</p>");});$("div").bind("click.plugin", function(){       $("body").append("<p>click.plugin事件</p>");});$("button").click(function() {  $("div").trigger("click!");    // 注意click后面的感叹号});  })  </script></head><body><div >test.</div><button >根据命名空间，触发事件</button></body>

1 0