在设计网页时,有时需要将输入框设置为只读状态,即其中的内容不可编辑,实现这种设计的方法有两种:
使用input的disable和readonly两个属性。
  先来看下二者的区别:
<input type= "text " readonly= "true " value= "这是readonly的! ">
<input type= "text " disabled= "true " value= "这是disabled的! ">
  可以看到,虽然两种都是让input的内容不能被用户编辑,但是对于后期的美工处理就有问题了!
  例如:
​<style>
input
{
color:blue;
}
</style>
  只有readonly的那个文本是蓝色的!
disabled是按系统设置的disabled颜色来设置前景色的,css对其无效!
  另外,readonly和disabled还有一个不同点就是,当input属性为readonly时,提交表单是可以获得input的内容。
如果是disabled则不能获得所提交的内容,返回值全部为null,所以此处需要注意。
慎用readonly和disabled,指定了disabled的表单,在submit时,不会把它的值传出去。
  例如,有两个text,一个是readonly一个是disabled,submit后,只能发送那个不是disabled的。

input的disable和readonly的更多相关文章

  1. input标签 disabled 和 readonly的区别

    需求描述:今天提交代码,老大审了一下,给我指出了一个改正的地方,XXX的详细信息页面(不是修改页面) input的内容是不能改的,给我指出的时候,我立马就知道了这个该怎么改了,加个readonly不就 ...

  2. 最近遇到的若干Web前端问题:disable和readonly,JqueryEasyUI,KindEditor

    最近项目中用到了Jquery Easyui和KindEditor等框架组件,问题真不少啊~  一些看起来很简单理所当然的事情,竟然花费了不少时间,才解决好~  1.readonly和disable的区 ...

  3. input属性disabled和readonly的区别

    两种属性的写法如下: 1.<input type="text" name="name" value="xxx" disabled=&q ...

  4. html <input type="text" />加上readonly后在各种浏览器的差异。

    <html> <body> <p>Name:<input type="text" name="email" /> ...

  5. input属性 disabled与readonly的区别

    从效果上看 源码 <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...

  6. input的disabled和readonly区别

    <input name=”country” id=”country” size=12 value=”disabled提交时得不到该值" disabled=”disabled” > ...

  7. ios的input的输入框,readonly的时候,会弹出一小块ios的软键盘

    找了半天方法,结果input直接加个方法就好了 onfocus="this.blur()"

  8. 前端 html input标签 disable 属性

    该属性只要出现在标签中,表示禁用该控件 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  9. input 输入框不能点 readonly , disabled

    只读 readonly="readonly" 不可用 disabled="disabled" 背景变 灰色

随机推荐

  1. C#:加载Excel(待补充)

    string strConn; strConn = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + filePath + &qu ...

  2. for循环和增强版的for循环

    增强的for循环. 缺点:   对于数组.不能方便的訪问下标值.   对于集合,与使用Interator相比.不能方便的删除集合中的内容(在内部也是调用Interator). 除了简单遍历并读取当中的 ...

  3. 和求余运算巧妙结合的jns指令

    .text:004A78B1  and eax, 80000001h.text:004A78B6  jns short loc_4A78BD.text:004A78B8 dec eax.text:00 ...

  4. 求子数组的最大和要求O(n)

    //求子数组的最大和 //输入一个整形数组.有整数也有负数,数组中连续一个或多个子数组,每一个子数组都有一个和,求全部子数组的和的最大值,要求时间复杂度O(n) #include<iostrea ...

  5. Atitit.软件仪表盘(8)--os子系统--资源占用监测

    Atitit.软件仪表盘(8)--os子系统--资源占用监测 CPU使用 内存使用 磁盘队列 任务管理器 网络速度 插件列表( 资源管理器插件,浏览器插件,360optim) 启动项管理  (350) ...

  6. 【转】Appium_API(翻译+用法说明)

    转自:https://testerhome.com/topics/3711 1.contextscontexts(self): Returns the contexts within the curr ...

  7. Struts2初学 struts2自定义类型转换器

    一.问题的引出      Struts2的类型转换是基于OGNL表达式的,由于请求的参数都是字符串,而JAVA 本身属于强类型的的语言,这样就需要把请求参数字符串转换成其他类型.     Struts ...

  8. Python 元祖的操作

    注意:元祖定义后不可修改,单个元祖后面必须加逗号,否则认为是字符串:tuple = ('apple',) 1.定义元祖 tuple = ('apple','banana','grape','orang ...

  9. JAVA第一个窗体小程序

    import java.awt.*;public class Day1015_Frame{    public static void main(String[] args)    {         ...

  10. js代码中定义后台java中的上下文路径

    var href = <c:out value='${sessionScope.contextPath}' />