在页面加载时禁用提交按钮，调用函数后启用它 [英] Disable submit button on page load, enable it after function is called

问题描述

我有一个用户名/密码表单，用户在输入用户名后会出现密码。这里是HTML：

 < form action =login.phpmethod =post> 
<！ - 用户名表单 - > 
< div id =form1> 
< input type =textid =usernamename =usernameplaceholder =username> 
< input type =buttonvalue =id =test1onClick =switchForm（）> 
< / div> 
<！ - 密码表单 - > 
< div id =form2> 
< input type =passwordid =passwordname =passwordplaceholder =password> 
< input id =buttontype =submitvalue => 
< / form> 
  

以下是函数switchForm（）的Javascript：

  function switchForm（）{
 document.getElementById（form1）。style.display =none; 
 document.getElementById（form2）。style.display =block; 
 document.getElementById（password）。focus（）; 
} 
  

我有另一段代码，它有一个输入按钮模拟点击 test1 ，因此表单在用户按下Enter键时切换。问题是表单一直提交（包括空白密码字段）。我想要的是在页面加载期间禁用提交按钮，并在执行switchForm（）期间重新启用它。提前致谢！我认为它与.prop（）或.attr（）或其他东西有关，但我不确定这是做到这一点的最佳方式。

解决方案

如果您只想启用/停用输入：

  $（＃your_input）。 ATTR（ '禁用'， '禁用'）; //禁用
 $（＃your_input）。removeAttr（'disabled'）; //启用
  

示例：

http：// jsfiddle。 net / juvian / R95qu

I have a username/password form where the password appears after the user enters their username. Here is the HTML:

<form action="login.php" method="post">
    <!-- Username form -->
    <div id="form1">
        <input type="text" id="username" name="username" placeholder="username">
        <input type="button" value="" id="test1" onClick="switchForm()">
    </div>
    <!-- Password form -->
    <div id="form2">
        <input type="password" id="password" name="password" placeholder="password">
        <input id="button" type="submit" value="">
    </form>

and here is the Javascript for the function switchForm():

function switchForm() {
   document.getElementById("form1").style.display = "none";
   document.getElementById("form2").style.display = "block";
   document.getElementById("password").focus();
}

I have another piece of code that has the enter button simulate a click of test1 so the form switches when a user presses enter. The issue is the form submits all the way (including the blank password field). What I want is to disable the submit button during page load, and re-enable it during the execution of switchForm(). Thanks in advance! I think it has something to do with .prop() or .attr() or something, but I'm not sure the best way to do this.

解决方案

If you just want to enable/disable input:

$("#your_input").attr('disabled','disabled'); // disable
$("#your_input").removeAttr('disabled');//enable

Example:

http://jsfiddle.net/juvian/R95qu

这篇关于在页面加载时禁用提交按钮，调用函数后启用它的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！