本文实例为大家分享了jQuery绑定事件多种实现方法,供大家参考,具体内容如下

jQuery取消特定的click事件,jqueryclick事件

本文实例讲述了jQuery取消特定的click事件实现方法。分享给大家供大家参考,具体如下:

众所周知, jQuery可以多次绑定同一种事件, 而且绑定的每个事件都可以执行。
问题来了, 在动态生成的DOM中,
我们为某一元素绑定了两种不同的click(假设为A、B), append元素时,
所有元素又绑定一次B, …… 这样会导致最后点击时B事件会成倍往上翻。

幸运的是,jQuery 为我们提供了很优雅的方式, 来取消特定命名空间下的click.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>无标题页</title>
  <script src="jquery/jquery.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function(){
      $("#divTest").click(function(){
        alert("正式事件。");
      });
    });
    function bindEvent(){
      for(var i=0;i<3;i++){
        $("#divTest").bind("click.test",function(){
          testEvent();
        });
      }
    }
    function testEvent(){
      alert("测试事件");
    }
    function ignoreMultiEvent(){
      $("#divTest").unbind("click.test").bind("click.test",function(){
        testEvent();
      });
    }
  </script>
</head>
<body>
  <div id="divTest" style="height: 163px;text-align:center;line-height:163px;width: 500px; background-color: #0000FF;">
    点我进行测试
  </div>
  <input id="Button2" type="button" value="为上面的DIV绑定3次测试事件" onclick="bindEvent()" />
  <input id="Button1" type="button" value="保留正式事件, 取消已绑定的多次测试事件,再绑定一次测试事件 " onclick="ignoreMultiEvent()" />
</body>
</html>

更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》、《jquery选择器用法总结》及《jQuery常用插件及用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

<html>
<head>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script><!--百度CDN-->
</head>

<body>
<input type="text"/>
<input type="button" value="button1"/>
<script>
$(function(){
  var text = $(":text");
  var button = $(":button");
  //调试器记录日志 console.log("message"); 如:火狐浏览器,打开FireBug(按F12)

  //触发单个事件:两种方式
  button.bind("mouseover",function(){
    console.log("移入");
  });
  button.bind({
    "mouseout": function(){
      console.log("移出");
    }
  });
  //多个事件:三个方式
  text.bind("dblclick blur",function(){
    console.log("双击或者失去焦点");
  });
  text.bind({
    "dblclick blur":function(){
      console.log("双击或者失去焦点");
    }
  });
  text.bind({
    "dblclick":function(){
      console.log("双击");
    },
    blur:function(){
      console.log("失去焦点");
    }
  });

  //取消事件
  text.unbind("dblclick"); //取消单个事件
  //text.unbind("dblclick blur"); //取消多个事件
  //text.unbind(); //取消全部事件
});

</script>
</body>
</html>

您可能感兴趣的文章:

  • jQuery实现按钮只点击一次后就取消点击事件绑定的方法
  • JQuery事件e参数的方法preventDefault()取消默认行为
  • jQuery绑定事件监听bind和移除事件监听unbind用法实例详解
  • jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
  • jQuery事件绑定用法详解(附bind和live的区别)
  • jQuery实现获取绑定自定义事件元素的方法
  • jQuery事件绑定on()、bind()与delegate() 方法详解
  • 威尼斯人线上娱乐,JQuery调用绑定click事件的3种写法
  • 解决Jquery向页面append新元素之后事件的绑定问题
  • jQuery给动态添加的元素绑定事件的方法
  • JQuery中绑定事件(bind())和移除事件(unbind())

http://www.bkjia.com/Javascript/1104353.htmlwww.bkjia.comtruehttp://www.bkjia.com/Javascript/1104353.htmlTechArticlejQuery取消特定的click事件,jqueryclick事件
本文实例讲述了jQuery取消特定的click事件实现方法。分享给大家供大家参考,具体如下:
众所周知…