Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等。
共同点:都不能编辑和获取焦点。
不同点:
  readonly:使用表单post或get传递时会被传递出去。
  disabled:使用表单post或get传递时不会被传递出去。
但是readonly的显示效果是没有灰化的。
所有控件都有disabled 属性,但是不一定有readonly属性;点击被readonly掉的按钮照样可以触发事件,但是被disabled掉的按钮就无法使用了不管上面有没有事件。

在很多情况下,我们的增加、修改、查看一般使用同一个页面,这就会产生一个需求,那就是查看页面中的数据和修改页面的一些项一般是禁止用户输入和修改表单数据的,

一般情况下,我们可以使用readonly来实现一般的text,input框的禁止输入

特殊情况:部分表单不能修改(这些不能修改的表单包括没有readonly属性,如:select, radio, checkbox),我们可以先将这些项设置成disabled,在表单提交之前设置disabled设置成false,否则这些项是不会提交到后台的。

CSS禁止输入之readonly VS disable的更多相关文章

  1. html readonly 和 disable 区别

    readonly 和 disable的区别Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(te ...

  2. html input readonly 和 disable的区别

    Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / password)和textar ...

  3. readonly 和 disable的区别

    Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / password)和textar ...

  4. readonly与disable

    Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,但是表单元素在使用了disabled后,当我们将表单以POST或G ...

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

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

  6. jquery取<input>的readOnly属性,O要大写

    今天在jquery中取input的readonly属性时,发现 我这样写$(“#input”).readonly取这个属性时,总是undefined,后来一想,难道html中的属性only没有大写,是 ...

  7. HTML之禁止输入文本

    一个文本框,禁止输入文本有2个方式,一个是利用readonly ,一个是利用 disabled. 那么两者虽然目的都可以达到,但是从表现上来看disabled会显得更加的直观,为什么这么说. 请看截图 ...

  8. (网页)readonly和disabled的区别(转)

    转自脚本之家: 标签的readonly和disabled属性的区别: 在表单元素中,readonly和disable有类似之处,因为它们都可以将一些表单元素设置为"不可用"状态,当 ...

  9. 表单元素 disabled 和 readonly 辨析

    正确答案: B D 分析: Readonly 和 Disabled 是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: 1)Readonly只 ...

随机推荐

  1. CAS 之 Apereo CAS 简介(一)

    CAS 之 Apereo CAS 简介(一) Background(背景) 随着公司业务的不断扩展,后台接入子系统不断增多,那么我们将针对不同的平台进行拆分为各自对应的子系统, 权限是不变的,那么我们 ...

  2. [15单片机] STC15F104W开发入门及模拟串口程序

    STC15F104W开发入门及模拟串口程序 Saturday, 31. March 2018 09:42AM - beautifulzzzz 前言 最近找到一款51内核的SOP8封装的8脚单片机STC ...

  3. JavaWeb学习笔记四 request&response

    HttpServletResponse 我们在创建Servlet时会覆盖service()方法,或doGet()/doPost(),这些方法都有两个参数,一个为代表请求的request和代表响应res ...

  4. swift textview禁止用户使用复制粘贴

    //自定义一个TextView class Own_TextView: UITextView { override func caretRect(for position: UITextPositio ...

  5. 2017-2018-1 Java演绎法 第八周 作业

    团队任务:UML设计 团队组长:袁逸灏 本次编辑:刘伟康 团队分工 第一次使用泳道图,感觉非常方便,从图中的箭头和各个活动框中可以清晰地看出分工流程: 不过既然是博客园,分工就不能只贴图,markdo ...

  6. C语言--总结报告

    1.当初你是如何做出选择计算机专业的决定的? 经过一个学期,你的看法改变了么,为什么? 你觉得计算机是你喜欢的领域吗,它是你擅长的领域吗? 为什么? 当初填报志愿我是有很明确的专业方向的,就是IT类的 ...

  7. idea找不到package下的mapper.xml文件

    由于开发人员使用不同的开发工具,导致eclipse的开发人员将mapper.xml文件习惯性的放到package下,以便查看,而eclipse编译时,不会忽略package下的xml以及dtl文件,所 ...

  8. emqtt 试用(七)追踪

    追踪 EMQ 消息服务器支持追踪来自某个客户端(Client)的全部报文,或者发布到某个主题(Topic)的全部消息. 追踪客户端(Client): ./bin/emqttd_ctl trace cl ...

  9. istio入门(01)istio是什么?

  10. api-gateway实践(05)新网关工作 - 缓存定义

    一.缓存分类 1.服务注册信息 1.1.[GroupCode_VersionCode]对应[Version定义]的缓存                       缓存类型:hash         ...