js实现input button从不可用变为可用

浏览数：77 / 时间：2015年06月09日

有时候明明是些很简单的东西，因为自己的一些大意，可能就在那圈子里一直兜兜转转，好久都绕不出来。

所以我也愿意把这些很简单的愚蠢写出来，与君共享~

首先大家知道<input>有一个名叫“button”的type，它的可见与否由“disabled”属性决定。

下面的代码，我的原意是一个输入框和三个按钮。在点击“编辑”按钮前，另外三个都属于“不可用”状态，点击以后方能恢复可用。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>

<script type="text/javascript">

    function edit(){
      document.getElementById("editCode").disabled = true;
      document.getElementById("inviteCode").disabled = false;
      document.getElementById("randomCode").disabled = false;
      document.getElementById("submitCode").disabled = false;
    }

</script>
</head>
<body>
    <h3>邀请码设置</h3>
    <s:form>
        <table cellspacing="10">
            <tr>
                <th>当前邀请码:</th>
                <td><input type="text" name="inviteCode" id="inviteCode" value="" class="input" size="6" disabled/></td>
                <td><input type="button" name="randomCode" id="randomCode" value="随机获取" disabled/></td>
            </tr>
            <tr align="right">
                <td><input type="button" name="editCode" id="editCode" value="编辑" onclick="edit()"/></td>
                <td><input type="submit" name="submitCode" id="submitCode" value="确定" disabled/></td>
            </tr>
        </table>
    </s:form>
</body>
</html>