AJAX 被调用两次答案

【问题标题】：AJAX getting called twiceAJAX 被调用两次
【发布时间】：2016-02-25 04:58:05
【问题描述】：

我正在尝试使用 ajax 和 php 向数据库添加值。我有一个模态弹出窗口，它要求用户输入，并且在模态弹出窗口中有文本字段和提交按钮。当用户填写字段并点击提交按钮时，将调用 ajax 将值添加到数据库。

$('.dup-product').click(function(){    
    var owners = $(".total_product_owner").val();
        $(".getmailfields").empty();
        if(owners == 0){
            $(".getmailfields").empty();
        } else {
            for (i = 1; i <= owners; i++) {        
                $(".getmailfields").append("<div class='form-group email_forms'><label class='control-label col-sm-2' for=invite-"+i+">Member "+i+" email</label><div class='albox col-sm-10'><input type='email' class='form-control' name='invitefriends[]' placeholder='sam@unclejohn.com' required></div></div>");
            }
        }
});

以下代码是模态弹出窗口中的操作

$('.duplicate_product').click(function(){
    var prodid = $(this).attr('pid');
    var userid = $(this).attr('oid');  
    $.ajax({
        type : "post",
        url : "user.php",
        data: { 
                product_id: prodid,
                user_id: userid,
             },
        cache:false,
        success : function(html){
              location.reload();
            }
        });
});

当我从弹出窗口中点击提交时，数据被两次添加到数据库中。我该如何解决它？

php:

<?php   
$pid = $_POST['product_id']; 
$uid = $_POST['user_id'];

if (isset($pid) && !empty($uid)){  
    duplicate($pid,$uid);
} else {   
    echo "Are you trying to do something nasty??";
}

duplicate($pid,$uid){
 echo "Duplicated";
}

?>

【问题讨论】：

你的php代码也可以吗？
可能你同时提交了表单。
显示您的 HTML 标记也可能是您的表单正在提交。
需要更多细节或将代码放在 plunkr / jsfiddle

标签： php jquery ajax

【解决方案1】：

可能有以下任何一种情况

类重复产品有两个元素。如果是这种情况，使用 id 来绑定点击事件

$('#duplicate_product').click(function(){
var prodid = $(this).attr('pid');
var userid = $(this).attr('oid');  
$.ajax({
    type : "post",
    url : "user.php",
    data: { 
            product_id: prodid,
            user_id: userid,
         },
    cache:false,
    success : function(html){
          location.reload();
        }
    });

});

然后把id="duplicate_product"放到按钮上 2. 事件与按钮反复绑定。在这种情况下使用下面的代码

$('.duplicate_product').unbind('click').bind('click', function(){
var prodid = $(this).attr('pid');
var userid = $(this).attr('oid');  
$.ajax({
    type : "post",
    url : "user.php",
    data: { 
            product_id: prodid,
            user_id: userid,
         },
    cache:false,
    success : function(html){
          location.reload();
        }
    });

});

【讨论】：