小码哥的IT人生

Input Password readOnly 属性

JavaScript基础 2022-06-08 16:17:42小码哥的IT人生shichen

Input Password readOnly 属性

定义和用法

readOnly 属性设置或返回密码字段是否为只读。

不能修改只读字段。但是,用户可以选定、突出显示它并从中复制文本。

提示:如需防止用户与字段交互,请改用 disabled 属性

另请参阅:

HTML 参考手册:HTML <input> readonly 属性

实例

例子 1

将密码字段设置为只读:

document.getElementById("myPsw").readOnly = true;

完整实例:

<!DOCTYPE html>
<html>
<body>
密码:<input type="password" id="myPsw">
<p>单击按钮可将密码字段设置为只读。</p>
<p><b>提示:</b>如需查看效果,请尝试在单击按钮前后在密码字段中键入内容。</p>
<button onclick="myFunction()">设置为只读</button>
<script>
function myFunction() {
  document.getElementById("myPsw").readOnly = true;
}
</script>
</body>
</html>

可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html

例子 2

查明密码字段是否为只读:

var x = document.getElementById("myPsw").readOnly;

完整实例:

<!DOCTYPE html>
<html>
<body>
密码:<input type="password" id="myPsw" readonly>
<p>单击该按钮可查看密码字段是否为只读。</p>
<button onclick="myFunction()">试一试</button>
<p id="demo"></p>
<script>
function myFunction() {
  var x = document.getElementById("myPsw").readOnly;
  document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>

可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html

语法

返回 readOnly 属性:

passwordObject.readOnly

设置 readOnly 属性:

passwordObject.readOnly = true|false

属性值

描述
true|false

规定密码字段是否应该是只读的。

  • true - 密码字段是只读的
  • false - 默认。密码字段是可更改的

技术细节

返回值: 布尔值,如果密码字段是只读的,则返回 true;否则返回 false

浏览器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 10.0 支持 支持 支持

版权所有 © 小码哥的IT人生
Copyright © phpcodeweb All Rights Reserved
ICP备案号:苏ICP备17019232号-2  

苏公网安备 32030202000762号

© 2021-2024