bind()方法绑定事件的时候，第二个参数是函数，如果代码都写在函数里面，没有任何问题。但是，直接调用外部封装的函数需要注意，出错的例子：

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

</head>

<body>

	<div>点我</div>

   <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>

   <script>

	$("div").bind("click",popWindow());

	//弹窗测试函数

	function popWindow(){

		alert("弹窗方法执行了...")

	}

</script>

</body>

</html>

　　

上面这个例子打开网页立即弹窗，说明外部的函数立马执行了。当我们点击div的时候，没反应了。。。

在匿名函数里面调用外面封装的函数就没有问题了，正确的例子：

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

</head>

<body>

	<div>点我</div>

   <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>

   <script>

	$("div").bind("click",function(){popWindow()});

	//弹窗测试函数

	function popWindow(){

		alert("弹窗方法执行了...")

	}

</script>

</body>

</html>

这样就正常了。

我们在实际操作中，很可能绑定好多个函数，这个函数有的要求执行1次便需要解绑，有的需要一直绑定。这种情况下，错误的例子：

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

</head>

<body>

<div>点我</div>

   <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>

   <script>

   	$("div").bind("click",function(){popWindow1()});

	$("div").bind("click",function(){popWindow2();$(this).unbind("click");});

	//弹窗测试函数1

	function popWindow1(){

		alert("弹窗方法1执行了...")

	}

	//弹窗测试函数2

	function popWindow2(){

		alert("弹窗方法2执行了...")

	}

</script>

</body>

</html>

这样操作，点击1次后，其实是把click事件解除了。之后，当然popWindow1()和popWindow2()都不会执行了。如果我们需要popWindow2()点击一次后消失，而popWindow1()点击时一直存在。这种写法就不妥了。对于这种需求，正确的例子：

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

</head>

<body>

	<div>点我</div>

   <script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>

   <script>

   	$("div").bind("click",function(){popWindow1()});

	$("div").bind("click",function(event){popWindow2();$(this).unbind(event);});

	//弹窗测试函数1

	function popWindow1(){

		alert("弹窗方法1执行了...")

	}

	//弹窗测试函数2

	function popWindow2(){

		alert("弹窗方法2执行了...")

	}

</script>

</body>

</html>

这样，点击一次后，popWindow2()消失，而popWindow1()点击时一直存在。$(this).unbind(event) 把本次绑定的事件取消了，而不会取消之前绑定过的事件，灵活性增加了。比如前面有个条件，如果达到这个条件后，取消绑定的这个函数，就用这个方法。

当然，上面的这个例子比较简单，第二个函数可以用jquery中的one()方法绑定，点击一次后解绑实现同样的功能。

注意：unbind()去不掉行间事件

Jquery还有许多这样的例子，都是一样的解决办法。

Jquery中的bind()方法的一点问题的更多相关文章

  1. jQuery中的.bind()、.live()和.delegate()之间区别分析

    jQuery中的.bind()..live()和.delegate()之间区别分析,学习jquery的朋友可以参考下.   DOM树   首先,可视化一个HMTL文档的DOM树是很有帮助的.一个简单的 ...

  2. jquery 中一些 特殊方法 的特殊使用 一览表

    cnblogs的页面, 一种是管理页面, 是随笔的列表 a full list of essays. 另一种是 首页. 要搜索文档的话, 就使用 "首页"的那种方式. 一个jque ...

  3. jQuery中的bind() live() delegate()之间区别分析

    jQuery中的bind() live() delegate()之间区别分析 首先,你得要了解我们的事件冒泡(事件传播)的概念,我先看一张图 1.bind方式 $('a').bind('click', ...

  4. jQuery中的join方法

    和JS 中的JOIN 方法一样,将一数组按照JOIN的参数连接起来.比如: var arr = [ "a", "b", "c", " ...

  5. HTML5中的data-*属性和jQuery中的.data()方法使用

    原文地址链接:http://blog.csdn.net/fly_zxy/article/details/50687691: HTML5中的data-*属性 我们往往会根据需要在HTML标记上添加自定义 ...

  6. jQuery 中的 unbind() 方法

    jQuery 中的 unbind() 方法是 bind() 方法的反向操作,从每一个匹配的元素中删除绑定的事件. 语法结构: unbind([type][, data]); type是事件类型,dat ...

  7. 解决关于jquery中$.get(）方法总是报“HierarchyRequestError: Node cannot be inserted at the specified point in the hierarchy”错的方法

    解决关于jquery中$.get()方法总是报“HierarchyRequestError: Node cannot be inserted at the specified point in the ...

  8. jquery中的index方法

    问题描述:灵活使用jquery中的index方法 方法签名:index([selector|element]) 用法概述:P1.index(P2)  //调用者P1可以为对象或集合 参数为空,返回P1 ...

  9. 用JQuery中的Ajax方法获取web service等后台程序中的方法

    用JQuery中的Ajax方法获取web service等后台程序中的方法 1.准备需要被前台html页面调用的web Service,这里我们就用ws来代替了,代码如下: using System; ...

随机推荐

  1. [luogu2825 HEOI2016/TJOI2016] 游戏 (二分图最大匹配)

    传送门 Description 在2016年,佳缘姐姐喜欢上了一款游戏,叫做泡泡堂.简单的说,这个游戏就是在一张地图上放上若干个炸弹,看是否能炸到对手,或者躲开对手的炸弹.在玩游戏的过程中,小H想到了 ...

  2. 邓_ SVN·最新使用教程总结

    SVN简介: 为什么要使用SVN? 程序员在编写程序的过程中,每个程序员都会生成很多不同的版本,这就需要程序员有效的管理代码,在需要的时候可以迅速,准确取出相应的版本. Subversion是什么? ...

  3. lunix下的redis数据库操作——list列表

    首先,需要先了解栈和队列的概念: 栈  先进后出:类比弹夹上的子弹,最后上进弹夹的子弹第一个使用,砌墙的板砖,后来居上 队列  先进先出:排队打饭,先到先得 创建列表: 左添加:(栈的形式添加) lp ...

  4. 于工具类中@Autowired注入为NULL的问题记录

      记录:在实体类中加入@Component注解和@Autowired注解时Service不能注入成功. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 ...

  5. JAVA数据库连接的另一种实现及简单的数据插入及显示

    教材是JDK8的,家里也可以正规的测试JDK8, 但公司电脑是JDK6的,所以代码要相应的变动一下下,以适应老的TRY语句. Message.java package cc.openhome; imp ...

  6. TI C66x DSP 系统events及其应用 - 5.6（INTMUX）

    系统event 0~127(包含了eventCombiner的输出event 0~3)与CPU支持的12个可屏蔽中断是通过INTMUX寄存器进行映射的(不包含NMI.RESET).能够选择将系统eve ...

  7. BEGINNING SHAREPOINT&#174; 2013 DEVELOPMENT 第1章节--SharePoint 2013 介绍 SharePoint 2013 平台

    BEGINNING SHAREPOINT® 2013 DEVELOPMENT 第1章节--SharePoint 2013 介绍 SharePoint 2013 平台         SharePoin ...

  8. 【待解决】maven创建web报Cannot read lifecycle mapping metadata for artifact org.apache.maven.plugins

    Cannot read lifecycle mapping metadata for artifact org.apache.maven.plugins:maven-war-plugin:maven- ...

  9. fzu 1075 分解素因子

    代码: #include<cstdio> #include<cstring> #include<iostream> using namespace std; int ...

  10. Redis各种数据类型的使用场景

    Redis的六种特性 l Strings l Hashs l Lists l Sets l Sorted Sets l Pub/Sub Redis各特性的应用场景 Strings Strings 数据 ...