只读（Readonly）与禁用（Disable）的区别与使用

作者：吴晓佩
撰写时间：2019年1月18日
区别：
（1）表面上可看到的区别就是当这两个词都设置为true时，都为禁用状态，当鼠标移上时使用disable的相关控件时鼠标出现禁用样式，并且不可做任何操作，而Readonly还可以获取文本框里的焦点。
（2） Disable比readonly的使用范围比广，适用文本框、文本域、下拉框、button按钮、单选框…….而readonly只适用于input（text、passwork、textarea）。
（3） Disable设置为true之后是不可以向后台提交数据的，此时可以选择改用readonly进行禁用，或者在提交数据时取消禁用。

如下是我的做法：

先写一个方法。
获取相关控件的ID，如果是禁用就赋值为true，如果要取消禁用就复制为false（有jquery和DOM两种写法，如图有两种写法）
在所需要的操作里调用刚刚写好的方法就可以切换禁用与否的性能了，大量数据一起切换比较灵活，代码如下。

如果想直接把控件禁用或只读的即可在控件后面直接加readonly或disable即可，如下

下图是文本框跟下拉框跟按钮（保存与取消）是常态。

下图是禁用跟只读的状态（下拉框跟button按钮用了disable进行禁用，文本框是用了readonly属性，文本框是只读状态；文本框跟下拉框反灰，按钮颜色变浅）

只读（Readonly）与禁用（Disable）的区别与使用相关推荐

网页文本框只读readonly与不可用disabled区别
让文本框只读,在java类中可以取到值 <input type="text" name="entity.auditename" value="$ ...
禁用的来源disabled以及只读readonly，Vue给icon加禁用
一.禁用disabled来源众所周知,在element ui的button可以添加disabled参数来让按钮不能点击且鼠标会有一个禁用标符. disabled表示禁用input元素,不可编辑,不可 ...
html 取消只读属性,浅谈html中input只读属性readonly和disable的区别
Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / password)和textar ...
struts2 标签中read-only=true 和disabled的区别
struts2 标签中read-only=true 和disabled的区别都不能对内容进行修改,区别在readonly提交的时候还会有该字段,但是disabled会在提交的时候忽略该字段转载于: ...
Linux文件系统只读Read-only file system的解决方法
Linux文件系统只读Read-only file system的解决方法参考文章: (1)Linux文件系统只读Read-only file system的解决方法 (2)https://www. ...
readonly时禁用删除键，readonly按删除键后页面后退解决方案
readonly时禁用删除键, readonly按删除键后页面后退解决方案 >>>>>>>>>>>>>>>&g ...
总结const、readonly、static三者的区别【收藏、转载】20190614
总结const.readonly.static三者的区别 const:静态常量,也称编译时常量(compile-time constants),属于类型级,通过类名直接访问,被所有对象共享! a.叫编 ...
在VC中编程实现按钮的启用(enable)和禁用(disable)
在VC中编程实现按钮的启用(enable)和禁用(disable)- - 方法总的说只有一个,就是调用CButton::EnableWindow()函数[毕竟CButton是从CWnd继承下来的] 具 ...
html页面只读,textarea只读 readonly =true;
Java TextArea 只读问题 TextArea ta = new TextArea("",10,15,TextArea.SCROLLBARS_VEICAL_ON报啥错啊. ...
readonly于disable的区别及 name和id的区别
readonly表示只读,只能用于文本框,当表单提交时,该表单元素的值会提交给服务器 disable表示不可用,可以用于任何元素,表示该元素不响应任何事件,同时表单提交时,该表单元素的值不会提交给服务 ...

只读（Readonly）与禁用（Disable）的区别与使用

只读（Readonly）与禁用（Disable）的区别与使用相关推荐

最新文章

热门文章