做了一个弹出框效果，弹出框里是一个表单，开始的时候要查询数据库是否存在记录，如果不存在，表单下面的提交按钮触发click事件发起创建记录的请求。如果数据库存在记录，就把记录数据查询出来，显示在表单里面，点击表单下面的按钮，此时发起修改记录的请求。

       无非是做了一个判断，但是第一次操作正常：不存在记录->填写表单->点击按钮触发create的请求；第二次操作的时候完全懵逼了，发起query请求发现有记录->显示在表单中->修改表单数据->点击按钮触发modify请求。结果发现数据库又插入了一条记录。这两次如果不注意很容易进入误区，因为前台和后台都不报错。但是如果我再次点击弹出框时就不一样了，查询出了两条记录，后台返回的是一个对象。服务器报错了。找了好久，都搞不明白为什么会在第二次触发两个事件呢。最后不得不怀疑是不是绑定事件的问题。百度了一下：jQuery的事件覆盖问题。才醍醐灌顶：jQuery会把绑定的事件放进一个数组里面，不是想得那样会覆盖掉。同样是click事件，它会依次叠加，这样只会越来越多，按照我的逻辑。

       原生js不会出现这个问题，会覆盖以前的事件：

var btn=document.getElementById("btn");
btn.onclick=function(){
	alert("我是事件1");
};
btn.onclick=function(){
	alert("我是事件2");
};

这个只会弹出第二个alert提示。

jQuery的事件我们怎么写：

/*方式1：*/
$("#btn").click(function(){
	alert("我是事件1");
});
$("#btn").click(function(){
	alert("我是事件2");
});

/*方式2：*/
$("#btn").on("click",function(){
	alert("我是事件1");
});
$("#btn").on("click",function(){
	alert("我是事件2");
});

结果都会出现两个alert提示。那怎么办，只能移除事件了。查看了一下资料，发现jQuery的一些方法支持移除事件。根据jQuery不同的版本，有die,off,unbind和它们对应的绑定事件live,on和bind。上面的代码就变成了下面的：

$("#btn").on("click",function(){
	alert("我是事件1");
});
$("#btn").off("click").on("click",(function(){
	alert("我是事件2");
});

这样就不会出现事件链了。