`

HTML中Readonly和Disabled的区别

阅读更多
ReadOnly和Disabled的作用是使用户不能够更改表单域中的内容,但是二者还是有着一些区别的:
1、Readonly只针对input(text/password)和textarea有效,而disabled对于所有的表单元素有效,包括select,radio,checkbox,button等。
在表单元素使用了disabled后,我们将表单以POST或者GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去

常用情况:
1、在某个表单中为用户预填了某个唯一识别代码,不允许用户改动,但是在提交时需要传递该值,此时将属性设置为readonly
2、当用户正式提交了表单后需要等待管理员的信息验证,不允许用户再更改表单中的数据,而是只能够查看,由于disabled的作用元素范围大,所以此时应该使用disabled,但同时应该注意的是要将submit button也disabled掉,否则只要用户按了这个按钮,如果在数据库操作页面中没有做完整性检测的话,数据库中的值会被清除。
3、在用户按了提交按钮后,利用javascript将提交按钮disabled掉,可防止在网络条件比较差的环境下,用户反复点击提交按钮导致数据冗余地存入数据库

摘自:
http://hi.baidu.com/zidone/blog/item/78ae2cdd91fb06d88d10295e.html
分享到:
评论

相关推荐

    Readonly和Disabled的区别

    Readonly和Disabled是HTML表单中的两个重要的属性,它们都可以限制用户对表单元素的交互操作。尽管它们有共同的功能,即防止表单数据被修改,但它们之间存在着本质的区别。 首先,Readonly属性主要应用于input元素...

    表单中Readonly和Disabled的区别详解

    在HTML表单中,`readonly` 和 `disabled` 是两个重要的属性,它们都可以用来限制用户对表单元素的交互,但它们之间的区别在于作用范围、提交表单时的行为以及用户体验等方面。 首先,`readonly` 属性主要用于`...

    readonly和disabled的区别

    在网页表单设计中,`readonly` 和 `disabled` 是两个非常常见的属性,它们都用于限制用户对输入字段的编辑,但它们之间存在着显著的区别。理解这些差异对于创建功能完整且用户体验良好的表单至关重要。 首先,`...

    javascript中input中readonly和disabled区别介绍

    在JavaScript中,`readonly`和`disabled`是两个用于HTML表单中控制用户交互的属性。它们虽然都能防止用户修改表单元素的内容,但具体的行为和影响却有所不同。 `readonly`属性主要应用于`<input>`(如`type="text"`...

    HTML中Select不用Disabled实现ReadOnly的效果

    方法如下: 代码如下:<select onbeforeactivate=”return false” onfocus=”this.blur()” onmouseover=”this.setCapture()” onmouseout=”this.releaseCapture()”> <option>1 <...

    html表单属性readonly和disabled的使用方法

    两者之间的关键区别在于,`readonly`字段在提交表单时仍会传递其值,而`disabled`字段则不会。此外,`readonly`字段保持可点击和高亮状态,用户可以选中,而`disabled`字段则完全不可选中,视觉上表现出被禁用的状态...

    readonly和disabled属性的区别

    在HTML表单中,`readonly`和`disabled`属性都是用来限制用户输入的,但它们在功能和表现上有着明显的差异。理解这两个属性的区别对于创建交互式网页表单至关重要。 首先,`readonly`属性主要用于文本框(`...

    Readonly和Disabled之间的微小区别详解

    通常我们使用readonly和disabled这两个HTML属性来实现这一功能。尽管它们看起来都能达到相同的目的,但实际上,这两者之间还是存在一些本质的差异。 首先,我们要明确的是,readonly和disabled属性都可以防止用户...

    浅谈html中input只读属性readonly和disable的区别

    HTML中的`readonly`和`disabled`属性都是用来限制用户对表单元素的交互,但它们在实际应用中具有不同的效果和使用场景。 首先,`readonly`属性主要用于`<input>`(如`text`、`password`)和`<textarea>`元素。它...

    怎样通过disabled和readonly将input设置为只读效果.docx

    Disabled 和 Readonly 是两种常见的方法来实现 Input 只读效果,它们均可以使 Input 变为不可编辑状态,但它们之间存在着重要的区别。 Disabled 方法 Disabled 属性用于指定 Input 元素是否可用。当 Input 元素...

    jquery设置元素的readonly和disabled的写法

    总之,通过 jQuery 的 `attr()` 和 `removeAttr()` 函数,我们可以方便地控制 HTML 元素的 `readonly` 和 `disabled` 属性,实现动态交互效果,提高用户体验。在编写前端代码时,灵活运用这些方法能够帮助我们更好地...

    disabled与readonly的作用及区别介绍

    在网页开发中,`disabled` 和 `readonly` 是两个非常重要的属性,它们都用于限制用户对HTML表单元素的交互,但它们之间存在着显著的区别。接下来我们将深入探讨这两个属性的作用和差异。 首先,`readonly` 属性主要...

    jquery批量设置属性readonly和disabled的方法

    例如,某些情况下我们希望用户不能修改表单的输入值,或是整个表单暂时不可交互,这时就需要用到readonly和disabled属性。本文将详细介绍如何使用jQuery库来批量设置input元素的readonly和disabled属性。 ### 使用...

    表单元素属性readonly和disabled使用对比

    在HTML中,`readonly`和`disabled`是两个非常重要的表单元素属性,它们用于限制用户对表单输入的交互方式。这两个属性虽然在目的上相似,但它们的应用场景、操作行为以及在表单提交时的行为却有着明显的区别。 首先...

    HTML中禁用表单控件的两种方法readonly与disabled

    为此,HTML提供了两种方式来实现这一功能,即`readonly`和`disabled`属性。 首先,`readonly`属性适用于那些希望用户查看但不允许修改的输入控件。当你在输入标签如`<input>`中添加`readonly="readonly"`,该控件将...

    html表单控件禁用属性readonly VS disabled介绍

    在html中有两种禁用表单提交的方法,他们分别是:  1.给控件标签加\u4e0areadonly='readonly'属性  2.给控件标签加\u4e0adisabled='disabled'属性  例如:  <input type=text value= readonly=readonly />...

Global site tag (gtag.js) - Google Analytics