input变成不可编辑状态--disabled与readonly的区别

最新推荐文章于 2022-04-26 15:59:25 发布
原创 最新推荐文章于 2022-04-26 15:59:25 发布 · 486 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

博客介绍了使input变成不可编辑状态时，disabled与readonly的区别。disabled使文字变灰，表单序列化提交到后台会被忽略；readonly文字不变色，与可编辑输入框外观无异，表单序列化提交到后台会被处理，还给出了相关代码及效果展示。

input变成不可编辑状态--disabled与readonly的区别

 

disabled  文字会变成灰色，不可编辑。表单序列化提交到后台,会被忽略,不处理.

readonly  文字不会变色，与能编辑的输入框看起来没区别,但不能编辑。 表单序列化提交到后台,会处理.

以下为代码:

<div style="margin-bottom:10px">
	<input name="nameaaa" class="easyui-textbox" disabled label="姓名" style="width:100%">
</div> 
<div style="margin-bottom:10px">
	<input name="extbbb" class="easyui-textbox"  readonly label="备注" style="width:100%">
</div>

效果如下:

easyui label 编辑_easyui textbox 设置只读不可编辑状态
weixin_39856630的博客
12-22 443
在使用easyul的时候，发现输入框内容及不容易获取与设置，用jQuery的方式大部分失效。依稀记得好像是因为easyul会在原页面的基础上，生成了一些新的独有样式，并且暂时覆盖掉使用了easyul的标签块。 具体我也忘记了，反正知道有这么会事就可以啦，--输入框$("#xx").textbox(‘setValue‘,‘value‘); //设置输入框的值$(‘#xx‘).textbox(‘t...
表单文本框不可编辑，disabled与readonly区别
selaginella的专栏
03-14 3103
一般在更新表单数据时，不可避免的需要将文本框设置为不可编辑状态，使其不可修改（一般为主键），可以使用disabled=true 和readonly=true来实现，但是这两种情况是有些区别的。 区别： Readonly只针对input(text / password)和textarea有效，而disabled对于所有的表单元素都有效，包括select, radio, checkbox, b
easyui 所有控件只读属性使用教程
yqj234的专栏
04-26 2863
textbox控件 1.不可编辑 $(’#test’).textbox({ editable:false }); combobox控件 1.disable属性，灰色不可编辑 $("#id").combobox(‘enable’); //可用 $("#id").combobox(‘disable’); //不可用 $(’#id’).combobox({ disabled: true}); 注意： 设置{ disabled: true }属性后，此下拉框失去被渲染功能，（即对此下拉...
easyui textbox 设置成 readonly
周振伟的博客
10-24 1万+
textbox 用js动态设置成readonly $("#fuDaoDisCount").textbox('textbox').attr('readonly',false);
easyui textbox动态控制只读效果
周振伟的博客
12-15 5466
想做一个需求就是动态的控制textbox只读，但是发现给文本框设置了readonly之后，无法执行$(").textbox('setValue','');这个方法。 后来改用了disabled可以达到同样的只读的效果。 具体实现过程如下： 是否特殊： checked/>是 checked/>否 function changeReadOnly(){ if($("#isSpe
EasyUI的textbox的disable ,readonly 用法
dengshumi7891的博客
03-04 817
EasyUI的textbox,如果用了disable, 那么提交时,后台mvc controller是取不到值的, 如果用了Readonly, textbox的样式又没有变化, 让人一眼就感知到哪些是不能改的. 可以加上这样的样式,让readonly和disabled的样式一样 input:read-only { background...
通过disabled和readonly将input设置为只读效果
12-14
在HTML表单设计中，有时候我们需要用户只能查看输入框（input）中的内容而不能修改，这时我们可以使用`disabled`和`readonly`属性来实现只读效果。这两种属性虽然都能达到表面的只读目的，但它们在功能上存在显著...
让input变成不可编辑状态的方法.docx
03-10
和 readonly 属性类似，可以在 input 标签中添加 disabled 属性，以便让 input 变成不可编辑状态。例如：<input type="text" disabled="disabled" /> 3. 使用 JavaScript 代码 可以使用 JavaScript 代码来让 input...
disabled与readonly的作用及区别介绍
09-28
然而，这并不意味着完全不可更改，因为通过JavaScript或其他编程语言，我们仍然能够动态地修改`readonly`字段的值。例如，你可以编写一段脚本，在特定条件下解除`readonly`状态，允许用户进行编辑。`readonly`的典型...
让input变成不可编辑状态的方法.pdf
03-10
【标题】：“让input变成不可编辑状态的方法.pdf” 在HTML中，`<input>`标签用于创建用户可交互的表单元素，如文本框、按钮等。有时候，我们可能需要将一个`<input>`元素设置为不可编辑状态，以防止用户修改其中的...
javascript中input中readonly和disabled区别介绍
11-30
例如，下面的函数可以恢复一个被设为`readonly`或`disabled`的手机号输入框的可编辑状态： ```javascript function modify_phone() { if (confirm("您确定要修改您的手机号码吗？")) { document.moblie_act_form....
easyui textbox 设置只读不可编辑状态
热门推荐
在路上的小马达
06-21 6万+
      在使用easyul的时候，发现输入框内容及不容易获取与设置，用jquery的方式大部分失效。依稀记得好像是因为easyul会在原页面的基础上，生成了一些新的独有样式，并且暂时覆盖掉使用了easyul的标签块。  具体我也忘记了，反正知道有这么会事就可以啦，--输入框$("#xx").textbox('setValue','value');  //设置输入框的值$('#xx').text...
浅析easyui中的readonly和h5中的readonly
iCheetor
07-28 2593
在使用easyui的过程中，有时会将input框的readonly属性和easyui的readonly属性混用，然后动态修改这一状态，但在easyui中如果使用h5的readonly属性，使用removeProp("readonly");方法后，虽然input框可以编辑，但value却获取不到最新编辑后的值。 代码如下：   &lt;div&gt; &lt;input type="t...
改变上传文件表单默认样式
hero_hope的博客
06-09 4836
一.上传文件表单默认样式    1.代码&lt;div style="margin-top:50px; text-align:center"&gt; &lt;form id="uploadForm" action="" method="post" enctype="multipart/form-data"&gt; &lt;input id="f
设置input标签readonly状态下的输入框颜色
全场梦游c的博客
11-28 1万+
一般情况下 readonly状态下的输入框时灰色，如果想要改变颜色则需要添加一个css样式即可。 此操作将灰色改为白色。 &lt;style&gt; input[readonly]{ background-color: #ffffff      (可根据需要改颜色) } &lt;/style&gt;  ...
使用CSS使文本输入不可编辑
qq_43067585的博客
05-29 1912
在HTML中可以使用readonly属性创建不可编辑的文本输入。而在CSS的情况下，可以使用pointer-events属性使文本输入不可编辑。下面本篇文章就来给大家介绍一下，希望对大家有所帮助。 CSS pointer-events属性是一个指针属性，可以使用以下语句来停止指针事件，让文本输入不可编辑。 pointer-events：none; 示例：此示例显示两个输入文本，其中一个是不可编辑的。 <!DOCTYPE html> <html> <head&
WPF ComboBox样式
weixin_53370274的博客
12-31 2342
一、样式的样子就是这样的 二、样式Style - 不可编辑请设置 属性为ReadOnly=true属性 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.m...
easyui-textbox禁用时，增加样式
weixin_34143774的博客
02-12 283
为什么80%的码农都做不了架构师？>>> ...
el-input不可编辑的两种方法
最新发布
08-02
在 Element UI 中，`el-input` 组件提供了两种常见的属性来实现不可编辑的效果：`disabled` 和 `readonly`。这两种属性在功能和视觉效果上有所不同，具体实现方式如下。 ### 使用 `disabled` 属性 `disabled` 属性...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值