使用Ajax提交表单

时间:2012-10-02 03:35:45

标签: javascript jquery html ajax

所以我完全迷失了如何使用Ajax提交表单。我是Javascript的新手,希望我不是在脑子里。

当我单击表单上的提交时,我的页面上没有任何反应,而不是我的SQL数据库中应该存储信息(也是双重检查过程表单)。

如果有人愿意提供帮助,这是代码:

使用Javascript:

$(document).ready(function() {
    $('#form').submit(function() {
        $.ajax({
            url: "../process.php",
            type: "post",
            data: $(this).serialize()
        });
    });
});

HTML:

<form name="contact" method="post" action="" id="form">

    <span id="input">
        <input  type="text" name="first" maxlength="50" size="30" title="First Name" class="textbox">
        <input  type="text" name="last" maxlength="80" size="30" title="Last Name" class="textbox">
        <input  type="text" name="email" maxlength="80" size="30" title="Email" class="textbox">
        <textarea  name="request" maxlength="1000" cols="25" rows="6" title="Request"></textarea>
    </span>

    <input type="submit" value="Submit" class="submit">   

</form>

2 个答案:

答案 0 :(得分:1)

$('#form').submit(function(e) {
    e.preventDefault(); //prevents the page from refreshing
    var $this = $(this); // cache $(this) for later use
    $.ajax({
        url: "../process.php",
        type: "post",
        data: $this.serialize()
    });
}); 

也可能与dataType属性有关。或者其他各种各样的事情。

答案 1 :(得分:0)

我使用输入类型按钮代替提交按钮。当用户单击按钮使用单击事件时,我验证表单字段。验证通过后,调用ajax。

这样的事,

 <input type="button" value="Submit" class="submit">   

jQuery(function(){
jQuery('.submit').click(function(){
    if(validatemyform()){
    //call ajax here
}
});
});