Question

虽然数据库插入正常，但我的脚本无效。 “成功插入”消息位于saveclient.php页面上，而不在index.html上。

我的脚本（member_script.js） - 我把它放在名为js的文件夹中。

$("#clientSubmit").click( function () {
    $.POST( $("#saveClient").attr("action"), $("#saveClient :input").serializeArray(), function(info) { $("#result").html(info); } );
    clearInput();
});
$("#saveClient").submit( function() {
    return false;
});
function clearInput() {
    $("#saveClient :input").each ( function () {
        $(this).val('');
    });
}

我的HTML

<form id="saveClient" action="saveclient.php" method="POST" novalidate>
    <div class="row control-group">
        <div class="form-group col-xs-12 floating-label-form-group controls">
            <label>Name</label>
            <input type="text" class="form-control" placeholder="Name" name="name" id="name" required data-validation-required-message="Please enter your name.">
            <input type="text" class="form-control" name="date" id="date" value="November 1, 2015">
            <input type="text" class="form-control" name="time" id="time" value="9:20 pm">
            <input type="text" class="form-control" name="memberid" id="memberid" value="10002">
            <p class="help-block text-danger"></p>
        </div>
    </div>
    <div class="row control-group">
        <div class="form-group col-xs-12 floating-label-form-group controls">
            <label>Address</label>
            <input type="text" class="form-control" placeholder="Complete Address" name="address" id="address" required data-validation-required-message="Please enter your complete address.">
            <p class="help-block text-danger"></p>
        </div>
    </div>
    <div class="row control-group">
        <div class="form-group col-xs-12 floating-label-form-group controls">
            <label>Phone / Cellphone Number</label>
            <input type="text" class="form-control" placeholder="Phone / Cellphone Number" name="number" id="phone" required data-validation-required-message="Please enter your phone number.">
            <p class="help-block text-danger"></p>
        </div>
    </div>
    <div class="row control-group">
        <div class="form-group col-xs-12 floating-label-form-group controls">
            <label>Worked / Source of Income</label>
            <input type="text" class="form-control" placeholder="Worked / Source of Income" name="work" id="work" required data-validation-required-message="Please enter your type of worked.">
            <p class="help-block text-danger"></p>
        </div>
    </div>
    <br>
    <span id="result"></span>
    <div class="row">
        <div class="form-group col-xs-12">
            <button class="btn btn-success btn-md" id="clientSubmit" >Save</button>
        </div>
    </div>
</form>

<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery-1.8.3.min.js"</script>
<script src="script/jquery-1.8.1.min.js" type="text/javascript"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script src="js/classie.js"></script>
<script src="js/cbpAnimatedHeader.js"></script>
<script src="js/member_script.js"></script>

我的数据库查询（saveclient.php） - 正在运行，它将数据保存到数据库

<?php
    include_once('getconnect.php');
    $clientid = $_POST['memberid'];
    $name = $_POST['name'];
    $address = $_POST['address'];
    $number = $_POST['number'];
    $work = $_POST['work'];
    $date = $_POST['date'];
    $time = $_POST['time'];
    if (mysql_query("INSERT INTO member VALUES ('', '$clientid','$name','$address','$number','$work','$date','$time')")) 
        echo "Successfully Inserted!";
    else 
        echo "Insertion Failed";
 ?>

Answer 1

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var form=$("#saveClient");
$("#clientSubmit").click(function(){
$.ajax({
        type:"POST",
        url:form.attr("action"),
        data:form.serialize(),
        success: function(response){
            console.log(response);  
        }
    });
});
});
</script>

使用此代码，这将完美无缺。

脚本无法在html上工作或保存为.js文件

1 个答案: