提交错误的HTML / method="post“不起作用

Question

我有一个正在工作的php/mysql表单提交，我试图在表单提交后禁用submit按钮，

<form action=""  onsubmit="document.getElementById('submit-button').disabled = true;" method="post">
     <p><label>Username</label>
     <input id="username" type="text" name="username" value=""  autofocus/></p>

     <p><label>Password</label>
      <input type="password" name="password" value=""  /></p>

      <p><label></label>
     <input type="submit" id="submit-button" name="submit" value="Login"  /></p>
</form>

它很好，不需要提交，但当我添加它，我想后置方法不是开火。我试着补充：

onsubmit="document.getElementById('submit-button').disabled = true; return true;"

但没有运气。

Answer 1

而不是使用javascript。可以直接使用php。

<form action="" method="post">
<p><label>Username</label><input id="username" type="text" name="username" value=""  autofocus/></p>
<p><label>Password</label><input type="password" name="password" value=""  /></p>
<p><label></label><input type="submit" id="submit-button" name="submit" value="Login"  <?php  echo ('POST' == $_SERVER['REQUEST_METHOD']) ? 'disabled' : ''?>/></p>
</form>

如果你张贴，然后提交按钮将被禁用。

Answer 2

您的表单似乎是直接提交的，执行“action”标记。如果您想保持在同一个表单上，请尝试使用AJAX请求。

Answer 3

尝试：

<form action="" method="post">
     <p><label>Username</label>
     <input id="username" type="text" name="username" value=""  autofocus/></p>

     <p><label>Password</label>
     <input type="password" name="password" value=""  /></p>

     <p><label></label>
     <input type="submit" id="submit-button" name="submit" value="Login" /></p>
</form>

使用以下脚本：

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
    $("#submit-button").on("click", function(e){
        // For demo purpose
        e.preventDefault();
        document.getElementById("submit-button").disabled = true; 
    });
</script>