jquery ajax避免重复触发同一个事件

拿个我最近在作的功能举例：

    关注他人的功能：有一个关注按钮，实现关注与取消关注功能。(数据库是mysql)

    因为是ajax操做，有个回调方法，在返回success以前或者浏览器卡顿之间会出现重复触发同一个事件。

方法1：

    最笨的方法就是在关联表中插入数据前先查询 ，而后判断有没有两人的关联数据。若没有则插入，如有则不插入。此方法，当表单数据量多的时候，操做不只慢，还会给服务器带来必定压力。

方法2：

    setTimeout + clearTimeout

连续的点击会把上一次点击清除掉，也就是ajax请求会在最后一次点击后发出去

方法3：

button有一个属性是disabled，能够控制其是否能够点击，代码以下:

<input type="button" value="Click" id="subBtn"/>
<script type="text/javascript">
function myFunc(){
    //code
    //执行某段代码后可选择移除disabled属性，让button能够再次被点击
    $("#subBtn").removeAttr("disabled");
}
$("#subBtn").click(function(){
    //让button没法再次点击
    $(this).attr("disabled","disabled");
    //执行其它代码，好比提交事件等
    myFunc();
});
</script>

方法4：

    给ajax请求一个"开关"，效果等同于方法3。代码以下：

var flag = false //定义一个开关，默认是关

$("#subBtn").click(function(){
    if(!flag){
        flag = true; //打开开关
        //若开关处于开的状态，执行其它代码，好比提交事件等
        flag = false; //执行完代码，须要在回调函数的最后将开关关闭 
    }
});

    以上方法2,3比较经常使用。看到知乎上的大神说，能够本身写封装的ajax，内嵌一些机制，暂时还未理解，等理解了再完善一下。