禁用/启用提交按钮,直到填写完所有表格

Question

我希望我的表单提交按钮被禁用/启用,具体取决于表单是否完全填满.

填充输入后,禁用按钮将更改为启用.这很好用.但我希望它在输入被清除时禁用按钮.

这是我的脚本:

<script type="text/javascript" language="javascript">
    function checkform()
    {
        var f = document.forms["theform"].elements;
        var cansubmit = true;

        for (var i = 0; i < f.length; i++) {
            if (f[i].value.length == 0) cansubmit = false;
        }

        if (cansubmit) {
            document.getElementById('submitbutton').disabled = false;
        }
    }
</script> 
<form name="theform">
<input type="text" onKeyup="checkform()" />
<input type="text" onKeyup="checkform()" />
<input id="submitbutton" type="submit" disabled="disabled" value="Submit" />
</form>

Answer 1

只是用

document.getElementById('submitbutton').disabled = !cansubmit;

而不是只能单向工作的if子句.

此外,对于已禁用JS的用户,我建议disabled仅使用JS 设置初始值.为此,只需移动脚本<form>并调用checkform();一次即可.