ExtJs在disabled和readOnly美学分析

ExtJs中disabled和readOnly美观度的分析

ExtJs中。假设设置输入框为仅仅读属性,一般第一考虑的都是readonly=true

它的效果和正常输入框一样,可是不同意输入;

然而,它非常easy引起歧义,让用户第一感觉是它是输入框,有输入信息的冲动,事实上不然;

这时候,能够考虑使用disabled=true属性

这下绝对不会觉得可输入,一看就知道不同意改动,但字体颜色明显非常模糊,所以效果不佳;

因此。使用中经常仍然使用readOnly=true,但改动背景颜色来做到disabled的更好效果表现,效果例如以下:

明显感觉就是禁止输入,并且字体清晰。代码片段例如以下:

{columnWidth : 1,

layout : ‘form‘,

defaults : {

xtype : "textfield",

width : 150,

allowBlank : true,

readOnly : true,

    style:‘background:#E6E6E6‘

},

items:[

{fieldLabel:‘事件标题‘,name:‘event_title‘,width:435}

]

},

为什么要选择readOnly而不是disabled呢。另一个明显的差别:

disabled=true,表单提交时候无法把数据传递到后台Action层,而readOnly=true能够;这个差别和html中标签的disabled和readOnly性能差异是一致的。

版权声明:本文博客原创文章,博客,未经同意,不得转载。

时间: 2024-10-01 07:47:43

ExtJs在disabled和readOnly美学分析的相关文章

ExtJs中disabled和readOnly美观度的分析

ExtJs中disabled和readOnly美观度的分析 ExtJs中,如果设置输入框为只读属性,一般第一考虑的都是readonly=true 它的效果和正常输入框一样,但是不允许输入: 然而,它很容易引起歧义,让用户第一感觉是它是输入框,有输入信息的冲动,其实不然: 这时候,可以考虑使用disabled=true属性 这下绝对不会认为可输入,一看就知道不允许修改,但字体颜色明显很模糊,所以效果不佳: 因此,使用中常常仍然使用readOnly=true,但修改背景颜色来做到disabled的更

input属性 disabled与readonly的区别

从效果上看 源码 1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <form> 9 <table> 10 <caption>disabled与readonly的区别&

disabled和readonly的区别是什么

disabled和readonly的区别是什么:这两个属性有类似之处,但是区别也是巨大的,之所以说类似,是因为这两个属性好像都貌似能够将指定的元素设置为"不可用"状态,下面就简单介绍一下它们两个的区别,希望能够给大家带来一定的帮助.一.作用范围不同:disabled属性可以用语所有的表单元素.readonly属性只对<input type="text">.<textarea>和<input type="password&quo

input中的disabled 和 readonly的区别

1.Readonly只针对input(text / password)和textarea有效, 而disabled对于所有的表单元素都有效, 2.但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去, 而readonly会将该值传递出去(readonly接受值更改可以回传,disable接受改但不回传数据). disabled和readonly这两个属性有一些共同之处,比如都设为true,则form属性将不能被编辑,往往在写js代码的时

disabled OR readonly

1.对元素设置disabled以及readonly属性 $("#uid").attr("disabled",true); $("#uid").attr("readonly",true); 2.取消其属性 $("#uid").attr("disabled",false); $("#uid").attr("readonly",false); 区别: R

表单元素 disabled 和 readonly 辨析

正确答案: B D 分析: Readonly 和 Disabled 是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: 1)Readonly只针对 input(text/password) 和 textarea 有效,而 disabled 对于所有的表单元素都有效,包括 select, radio, checkbox, button 等. 2)若输入项的 disabled 设为 true,则该表单输入项不能获取焦点,用户的所有操作(鼠标点

input的disabled和readonly区别

<input name=”country” id=”country” size=12 value=”disabled提交时得不到该值" disabled=”disabled” > 放在form表单中提交后得不到该值. 将disabled=”disabled” 改为 readonly = “readonly” 即可 1. 设置为disabled的input将会有下面的限制: 不能接收焦点更不能被修改,使用tab键时将被跳过,被限制的对象值将不会被传递到后台程序. 2.设置为readon

input中的disabled、readonly和hidden

最近开发项目的时候,遇到一个问题,就是我希望某个input中的值不能被修改,刚开始的时候,我想到的是disabled属性!但是,发现表单提交后,值无法传递过来! 解决方法: 可以设置其readonly属性,同样不能被修改,但是表单提交后,值可以传递到后台! 一.HTML中直接设置: 1 <form action="test/addUser"> 2 disabled:<input type="text" value="zhangsan&qu

JQuery EasyUI设置input文本框disabled, readonly属性

因EasyUI对控件进行了封装,所以通常的Jquery代码设置不起作用,如$('#id').attr("readonly", "readonly"). 因此我们选择在input的上一级元素div中加一个class限定,如 <div class="fitem test">           <label>                角色ID<span >*</span>:</label&g