使用JS（JQ）出现重复POST的怪异情况

Question

在项目中自己设定了一个功能类似js原生confirm的功能，主要是给用户在操作的时候做二次确认，这个提示结构大致如下：这个是全站公用的，需要的时候就通过调用函数让它显示并传入对应的提示语之类的，通用调用函数大致如下：function show(tsy1,tsy2,tsy3){    document.getElementById("tsy1").innerHTML=cf1;    document.getElementById("tsy2").innerHTML=cf2;    document.getElementById("tsy3").innerHTML=cf3;};调用 show("提示语1","提示语2","提示语3"); 显示对应提示，然后用$('#yes').click(function() {}向后台POST数据出现的问题情况是这样的：当我因某个操作调用到这个函数时，那么上面的HTML就显示了(通过CSS的display属性控制)，会有“取消”和“确定”两个按钮可选择，正常情况就是我点击“确定”就Ajax向后台POST数据然后返回对应结果但是假如我手贱，我调用这个函数后，我没点击“确定”，而是点击了“取消”，然后我再次调用这个函数，再点击“取消”，然后我再次调用这个函数，再点击“取消”，然后我再次调用这个函数，再点击“取消”.....如此反复调用反复取消N次之后，我才点击“确定”，奇怪的是发生了，这时点击“确定”就向后台POST了N次！！！为啥会这样呢？难道是每次调用函数的时候都新增一个"id=yes"?

Answer 1

$('#yes').unbind().click(function() {}

试试这个

Answer 2

首先恭喜您已解决该问题！

导致该问题的原因是多次绑定导致的！

解决办法很多：

// 方法一

$('#yes').off('click').on('click',function () {});

// 方法二

$('#yes').unbind().click(function() {});

// 方法三

$('#yes').one('click',function(){});