描述:当用户点击禁用按钮的时候,文本框就会变为禁用状态,用户不可以进行输入,当用户点击解除禁用的时候,文本框恢复以前的状态,可以进行编辑输入。
关键字:disabled,当disabled的值为true,或者字符串转换成boolean类型时,值为true的时候,文本框就会进入禁用状态,不可以进行编辑。
代码实现如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>禁用文本框</title>
</head>
<body>
    用户名:<input type="text" value="禁用文本框"><button>禁用</button><button>解除禁用</button>
</body>
</html>
<script>
    //获取事件源和相关元素
    var inp = document.getElementsByTagName("input")[0];
    var btn1 = document.getElementsByTagName("button")[0];
    var btn2 = document.getElementsByTagName("button")[1];
    //绑定事件
    btn1.onclick = function () {
        //书写驱程序
        inp.disabled = true;
    }
    btn2.onclick = function () {
        //书写驱动程序
        inp.disabled = false;
    }
</script>
Last modification:March 28th, 2018 at 01:31 pm
If you think my article is useful to you, please feel free to appreciate