Php Jquery Ajax只运行一次

下面是Php代码

function postData() {
    var fName=$("#fName").val();
    var lName=$("#lName").val();
    var city=$("#city").val();
    var data="fName="+fName+"&lName="+lName+"&city="+city+"&submit=submit";
    $.ajax({
        type:'POST',
        url:'employeeajaxcodebehind.php',
        data:data,
        success:function(data){
        $("#results").html(data);
        }
    });
}

Html:

名字：

姓氏：

城市：

现在的问题是，每当我打开页面时，我都会插入一条记录，并将其成功保存到我的数据库中。但是当我添加另一个记录时，它不会被保存。。。我必须在每次插入时重新加载页面

---

这里有什么问题？还有php函数

viewRecord（）应该执行，但它不是
 这是因为您将emp_id添加为空（如果它不是主键或唯一键）。您需要在sql中省略以下内容：

<form method="POST">
    Firstname: <input type="text" id="fName" name="fName"><br>
    Lastname: <input type="text" id="lName" name="lName"><br>
    City: <input type="text" id="city" name="city"><br>
    <input type="submit" id="submit" name="submit" onclick="postData();">
</form>

JS更改：当您使用提交按钮时。您需要防止页面不刷新。因此，更改ajax调用，如下所示：

$sql = "INSERT INTO employee(firstname,lastname,city) VALUES ('$fName','$lName','$city')";


/*将提交处理程序附加到表单*/
$（“#评论表单”）。提交（功能（事件）{
/*阻止表单正常提交*/
event.preventDefault（）；
/*从页面上的元素获取一些值：*/
var$form=$（此），
var url=“employeeajaxcodebehind.php”//或$form.attr（'action'）；
/*使用post发送数据*/
var posting=$.post（url，{fName:$（'#fName'）.val（），lName:$（'#lName'）.val（），city:$（'#city'）.val（））；
/*将结果放入div中*/
过帐.完成（功能（数据）{
$（“#结果”）.html（数据）；
});
});
用于从表单获取数据

您的表单也会发送数据两次——onclick和onsubmit。请通过添加
返回false来防止onsubmit事件
正如@skparwal提到的问题是，您试图将“”插入主键中。您需要在插入后使用
mysql\u error（）
，查看发生了哪些错误。请查看此链接，了解如何执行此操作：

此外，您的ajax也无法按预期工作，因为您没有为onClick（）返回false，这意味着每次触发ajax调用后都会提交表单

此外，您应该转向mysqli或PDO，因为mysql已不推荐使用

编辑

试试这个，但它不是为了工作或是最终实现，它只是为了让您走上正确的道路。它未经测试，因此可能存在一些错误：

将您的javascript更改为：

<script type='text/javascript'>
    /* attach a submit handler to the form */
    $("#commentForm").submit(function(event) {

      /* stop form from submitting normally */
      event.preventDefault();

      /* get some values from elements on the page: */
      var $form = $( this ),
      var url =  "employeeajaxcodebehind.php" // or $form.attr( 'action' );

      /* Send the data using post */
      var posting = $.post( url, { fName: $('#fName').val(), lName: $('#lName').val(), city: $('#city').val() } );

      /* Put the results in a div */
      posting.done(function( data ) {
        $("#results").html(data);
      });
    });
</script>

将您的PHP更改为：

$(function(){
    $('#submit').click(postData);
});

function postData() {
    var fName=$("#fName").val();
    var lName=$("#lName").val();
    var city=$("#city").val();
    var data="fName="+fName+"&lName="+lName+"&city="+city+"&submit=submit";
    $.ajax({
        type:'POST',
        url:'employeeajaxcodebehind.php',
        data:data,
        success:function(data){
            $("#results").html(data);
        }
    });
    return false;
}

将您的HTML更改为：

if(isset($_POST['submit'])) {
    $fName=$_POST['fName'];
    $lName=$_POST['lName'];
    $city=$_POST['city'];
    $Query="INSERT INTO employee(firstname,lastname,city) VALUES ('$fName','$lName','$city')";
    if( !( $Result=mysql_query($Query) ) )
        exit( '@todo need to check for error here' );
    viewRecord();
}


名字：

姓氏：

城市：

HTML/您的表单在哪里？postData如何调用？请立即检查。。我添加了htmltry，将
return false
放在
onSubmit
form事件上，这样你就不会想得到一个小小的Bobby表了。。然后使用我在答案中写的查询。它会很好用的。检查ITI如果定义主键，则不应将空值保存到其中。（如果定义一个唯一键，它将只接受一次null值）。否，但其自动递增：Shave要尝试上述查询吗？是的，它应该是一个自动递增。再一次，用普通按钮替换提交按钮。我不知道如何使用serialize（），因为这是我正在做的第一个jquery工作。。。我应该删除if（isset（$\u POST['submit']）？你能告诉我如何返回false吗？是的，工作很好…甚至函数viewRecord（）；也在工作…我做错了什么：我的老师这样教我：S
if(isset($_POST['submit'])) {
    $fName=$_POST['fName'];
    $lName=$_POST['lName'];
    $city=$_POST['city'];
    $Query="INSERT INTO employee(firstname,lastname,city) VALUES ('$fName','$lName','$city')";
    if( !( $Result=mysql_query($Query) ) )
        exit( '@todo need to check for error here' );
    viewRecord();
}

<form method="POST">
    Firstname: <input type="text" id="fName" name="fName"><br>
    Lastname: <input type="text" id="lName" name="lName"><br>
    City: <input type="text" id="city" name="city"><br>
    <input type="submit" id="submit" name="submit">
</form>