Javascript Can'；我不能用ajax提交两次表单

大家好，我在用ajax提交表单（我认为很简单）时遇到了一些问题

用户第一次提交表单时，一切都正常：div的内容发生变化，php被处理。但是，如果我的数据库中没有匹配项，它将返回“f”，javascript将写回一个不能使用ajax重新提交的表单

HTML：

<div class="maincontainer" id="login">

  <form id="loginform" onsubmit="void login();return false;">

    <input name="username" type="text" class="textboxinput"  id="username"  autocomplete="off" />
    <input name="password" type="password" class="textboxinput" id="password"  autocomplete="off" />
    <input type="submit" name="button" class="button" id="button" value="Login" /> 
  </form>
</div>

Javascript：

function login(){

    //Change the box content to "Logging in"
    $("#login").html("<p style='line-height:170px;text-align:center;width:100%;margin:0px;padding:0px;'>Logging in</p>");

    //Get the values of the username and password field
var username = $('#username').val();
var password = $('#password').val();

    //Make the ajax request
$.ajax({        
        datatype: "text",
        type: "POST",
        url: "process.php",
        data: "username=" + username + "&password=" + password,
        success: function (m) {

        //If there's no match, rewrite the form in the div  
            if ( m == "f"){
                content= "  <form id='loginform' onsubmit='void login();return false;'><input name='username' type='text' class='textboxinput' id='username' autocomplete='off' /><input name='password' type='password' class='textboxinput' id='password' autocomplete='off' /><input type='submit' name='button' class='button' id='button' value='Login' /> <p style='font-size:small;'>Login failed, please try again</p></form>";         
                $("#login").html(content);
            }
        }

    });



};

function login(){

    var username = $('#username').val();
    var password = $('#password').val();

//Do security checks here


    $("#loginform").hide();

    $("#errorbox").html("<p class='logloading'>Logging in</p>");

    $.ajax({        
        datatype: "text",
        type: "POST",
        url: "login.php",
        data: "username=" + username + "&password=" + password + "&method=js",
        success: function (m) {

            if ( m == "f"){ 
                $("#errorbox").html("");
                $('#username').val("");
                $('#password').val("");
                $("#loginform").show();
                $("#errorshow").html("<p class='errormsg'>Wrong username/password combination</p>");
                $("#username").focus();

            }

            else{
                window.location = m;                
            }
        }

    });
    return false;
};

函数登录（）{
//将框内容更改为“登录”
$（“#login”）.html（
登录
）；
//获取用户名和密码字段的值
var username=$（'#username'）.val（）；
var password=$（'#password'）.val（）；
//发出ajax请求
$.ajax（{
数据类型：“文本”，
类型：“POST”，
url:“process.php”，
数据：“username=“+username+”&password=“+password，
成功：功能（m）{
//如果没有匹配项，请重写div中的表单
如果（m=“f”）{
content=“

function login(){

    var username = $('#username').val();
    var password = $('#password').val();

//Do security checks here


    $("#loginform").hide();

    $("#errorbox").html("<p class='logloading'>Logging in</p>");

    $.ajax({        
        datatype: "text",
        type: "POST",
        url: "login.php",
        data: "username=" + username + "&password=" + password + "&method=js",
        success: function (m) {

            if ( m == "f"){ 
                $("#errorbox").html("");
                $('#username').val("");
                $('#password').val("");
                $("#loginform").show();
                $("#errorshow").html("<p class='errormsg'>Wrong username/password combination</p>");
                $("#username").focus();

            }

            else{
                window.location = m;                
            }
        }

    });
    return false;
};

函数登录（）{
var username=$（'#username'）.val（）；
var password=$（'#password'）.val（）；
//在这里做安全检查吗
$（“#loginform”）.hide（）；
$（“#errorbox”）.html（“
登录”
”；
$.ajax（{
数据类型：“文本”，
类型：“POST”，
url:“login.php”，
数据：“username=“+username+”&password=“+password+”&method=js”，
成功：功能（m）{
如果（m==“f”）{
$（“#errorbox”）.html（“”）；
$（'#username'）.val（“”）；
$（'#password'）.val（“”）；
$（“#loginform”）.show（）；
$（“#errorshow”）.html（“
错误的用户名/密码组合”
”；
$（“#用户名”）.focus（）；
}
否则{
window.location=m；
}
}
});
返回false；
};

---

哦，我应该感谢所有在这里发表评论（并发布）的人，每一条信息都对我有所帮助。

只是一个修复，而不是对您最初问题的明确回答

我会用

data: $('#form_id').serialize()

不要手动执行所有这些操作：

data: "username=" + username + "&password=" + password,

当用户提交空间时会发生什么？您的查询中断

只需确保用户名框的名称为

username

，密码框遵循相同的模式

---

编辑

这个代码有点奇怪：

onsubmit='void login();return false;'

不要手动输入此代码，请尝试此代码（只需删除该部分并插入此代码）：

---

我想我不久前也遇到了这个问题

---

一个可行的解决方法是将登录功能放在单击submit按钮上（同时返回false）

问题出在哪里，您想做什么？既然您在读取用户名和密码的值之前更改了容器的HTML，您如何读取用户名和密码？你检查过它们的值吗？@Cfreak新表单不会使用JavaScription你用Firebug检查过你的页面了吗？签出Firebug控制台，如果出现异常情况，它通常会向您显示一条消息。否则，您可能需要签出Firebug的调试器并设置断点。您还可以在“HTML”-选项卡中检查HTML/div结构。（前后…）谢谢。这是一个快速编写的脚本，我知道有很多安全问题。再次感谢！但这并没有解决我的问题，实际上我可以在login（）中添加“return false；”；是 啊我尝试过，但不适用于我，并且会阻止用户在某些浏览器上输入密码后按enter键。Thx anws