在页面加载时禁用提交按钮,在调用函数后启用它

时间:2014-02-24 23:22:57

标签: javascript jquery html forms

我有一个用户名/密码表单,用户输入用户名后会显示密码。这是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>

这里是函数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()等有关,但我不确定最好的方法。

1 个答案:

答案 0 :(得分:5)

如果您只想启用/禁用输入:

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

示例:

http://jsfiddle.net/juvian/R95qu