标签：

前端是这样的

原本的逻辑是点击提交之后，出现模态框，然后点击评论之后用ajax把数据提交给后端，看起来没问题，但是手残把两个按钮嵌套一起了，

（代码并不完整）

错误的代码

$("#回复按钮").on('click', function(){
    //获得回复对象的信息;
    $("模态框中的评论").on('click' function(){
        //获得弹出框中的绰号和内容
        .ajax({
            传输数据;
        });
    )};
)};

然后问题就来了，我们可以看到这个效果

<img src="http://img.blog.csdn.net/20150419154714602?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMTQzNzY4MA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="" /> 

评论1正常，评论2显示了两次，评论三经测试果然显示了三次

这个问题就出在了两个button on click事件的嵌套上

第一次按下外部的button回复 它开始监听内部的button评论是否被按下，第二次按下外部button，第一次的外部button在监听内部的button被点击的时间，第二次的外部button同样在监听，于是会给服务器post两次数据，以此类推........

解决方案，把两个button的click事件分开写

正确代码

$("#回复按钮").on(‘click‘, function(){
    //获得回复对象的信息;
)};

$("弹出框中的评论").on(‘click‘ function(){
        //获得弹出框中的绰号和内容
        .ajax({
            传输数据;
        });

)};

ajax 和bootstrap混用手残出现的一个bug

标签：

原文地址：http://blog.csdn.net/u011437680/article/details/45129721