在设计网页时,有时需要将输入框设置为只读状态,即其中的内容不可编辑,实现这种设计的方法有两种:
使用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. Mycat和MySQL的差别——Mycat的核心作用

    有个朋友面试的时候被问到:Mycat和MySQL的差别.我们能够把上层看作是对下层的抽象,比如操作系统是对各类计算机硬件的抽象.那么我们什么时候须要抽象?假如仅仅有一种硬件的时候,我们须要开发一个操作 ...

  2. unity, yield return new WaitForSeconds(waitTime) 在 Time.timeScale=0下卡死

    例如下面代码: IEnumerator f(){ Time.timeScale = 0; float waitTime=2; yield return new WaitForSeconds (wait ...

  3. RPC服务框架dubbo(一):简介和原理解析

    前置概念 在学习dubbo前,需要先了解SOA和RPC这两个概念. SOA 1.英文名称(Service Oriented Ambiguity) 2.中文名称:面向服务架构 2.1 有一个专门提供服务 ...

  4. CControlLayer

    #ifndef __CONTROLLAYER_H__ #define __CONTROLLAYER_H__ #include "XWidget.h" class CMapDialo ...

  5. Linux之系统管理员笔记

    1.查看最近一次启动时间 who -b system boot -- : 2.who命令实现带有“表头”的查询结果 who -H NAME LINE TIME COMMENT root pts/ -- ...

  6. js 去html 标签

    var stylereg = /style\=".+?"/g //去style样式 var alltagreg = /<[^>]*>/g //去除全部标签 var ...

  7. Bootstrap学习笔记(4)--导航栏

    相关类: nav, nav-pills, nav-tags, nav-stacked ul里使用,导航格胶囊,方片外观,堆叠外观 navbar, navbar-header, navbar-brand ...

  8. C语言 · 素数判断

     算法提高 素数判断   时间限制:1.0s   内存限制:512.0MB      编写一函数IsPrime,判断某个大于2的正整数是否为素数. 样例输入: 5样例输出:yes 样例输入: 9样例输 ...

  9. 16V554 的测试代码

    //------------------------------------------------------------------------ #include   "AT16C554 ...

  10. Spring整合activiti单元测试

    ** * Spring测试activiti配置是否正常 * <p>Title: SpringActivitiTest</p> * <p>Description: & ...