关闭

readonly与disabled的区别

时间: 2019-01-24阅读: 1189标签: 属性

一. 范围不同

readonly 只对 <input> 和 <textarea> 标签有效

disabled 对所有表单元素都有效, 包括:<input>, <textarea>, <button>, <label>, <option>, <select>等


二. 程度不同

readonly 只是将元素设置为只读,不可输入,对其它操作没有影响

disabled 阻止元素的一切操作。包括 获取焦点,点击事件等


三. 表单提交

readonly 只是将元素设置为只读,不影响表单提交

disabled 设置了该属性的表单元素,值将不会随着表单一起提交


四. JavaScript操作

设置了readonly和disabled的表单元素,用户无法再界面上改变它的值。但通过JavaScript是可以改变其值的,同样背景色,字体颜色等也可以通过JavaScript来改变。

例如:下面的代码运行在chrome浏览器中时,点击“点我”后两个input框的字体颜色、背景色,值都会发生变化。

$('input').attr("readonly","readonly") //将input元素设置为readonly  
$('input').removeAttr("readonly"); //去除input元素的readonly属性  
 或
$('input').attr("readonly",true)
$('input').attr("readonly",false)
$('input').val ('1')   // 设置input的值
注: 使用表单post或get传递时会被传递出去
$('input').attr("disabled","disabled") //将input元素设置为readonly  
$('input').removeAttr("disabled"); //去除input元素的readonly属性  
 或
$('input').attr("disabled",true)
$('input').attr("disabled",false)
$('input').val ('0')   // 设置input的值

//注: 使用表单post或get传递时不会被传递出去


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

链接: http://www.fly63.com/article/detial/1877

css中如何使用border属性与display属性

border属性介绍:border属性设置元素边框。边框3个要素如:粗细、线型、颜色。边框颜色可以省略不写,默认为黑色。如果其他2个属性不写就不会显示边框。

Js中的offsetWidth、clientWidth、innerWidth及相关属性方法

下面的元素属性和元素方法都通过 elem.属性 或 elem.方法 的方式使用,window属性通过 window.属性 的方式使用,document属性则通过document调用:

CSS overflow-wrap新属性值anywhere是干嘛用的?

CSS overflow-wrap 属性其实就是以前的 word-wrap 属性,MDN现在直接把 word-wrap 的文档页跳转到 overflow-wrap 属性的文档页了。由于 overflow-wrap 属性IE浏览器不支持,而其他现代浏览器依然支持老的 word-wrap 属性语法

React 最重要也最容易被遗忘的属性 $$typeof

为什么说 $$typeof 是最重要的属性?因为它是代码安全的一道重要防线。如果你用过 React,对 type、 props、 key、 和 ref 应该熟悉。 但你不一定知道 $$typeof?

Vue计算属性和侦听属性

一些初学者可能对计算属性和侦听属性的使用场景感到困惑不解,本文主要介绍两者的用法、使用场景及其两者的区别。计算属性是自动监听依赖值的变化,从而动态返回内容,监听是一个过程,在监听的值变化时

vue实用的计算属性小技巧

我们时常会碰到后端要“开始时间” - “结束时间”(分为两个变量存放),但是呢!我们使用的时间选择器的组件又只能绑定一个数组,这个时候,我们传给后端的时候需要将数组拆散

javascript中什么是访问器属性?

访问器属性不包含数据值。它包含一对getter和setter函数。当读取访问器属性时,会调用getter函数并返回有效值;当写入访问器属性时,会调用setter函数并传入新值,setter函数负责处理数据。

常用的CSS属性

页面渲染时,dom元素所采用的 布局模型,可以通过 box-sizing 进行设置,根据计算高度的区域可分为:content-box (W3C 标准盒模型),border-box (IE盒模型)

css3新增的属性有哪些?

CSS 用于控制网页的样式和布局。CSS3 是最新的 CSS 标准。CSS3新增了很多的属性,下面一起来分析一下新增的一些属性:

Js中offset、scroll、client的理解

在下开发中经常碰到 offset、scroll、client 这几个关键字,比如 offsetLeft、offsetHeight、scrollHeight、clientTop 什么的,每次都要各种实验,这里总结一下,一劳永逸。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!