有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,如使<input type="text" name="input1" value="中国"> 的内容,"中国"两个字不可以修改。实现的方式归纳一下,有如下几种。

方法1: onfocus=this.blur() 当鼠标放不上就离开焦点
<input type="text" name="input1" value="中国" onfocus=this.blur()>

方法2:readonly 
<input type="text" name="input1" value="中国" readonly> 
<input type="text" name="input1" value="中国" readonly="true">

方法3: disabled 
<input type="text" name="input1" value="中国" disabled="true">

完整的例子:

<input name="ly_qq" type="text" tabindex="2" onMouseOver="this.className='input_1'" onMouseOut="this.className='input_2'" value="123456789" disabled="true" readOnly="true" />

disabled="true" 此果文字会变成灰色,不可编辑。 
readOnly="true" 文字不会变色,也是不可编辑的

css屏蔽输入:<input style="ime-mode: disabled">

有两种方法第一:disabled="disabled"这样定义之后被禁用的 input 元素既不可用,也不可点击。第二:readonly="readonly" 只读字段是不能修改的。不过,用户仍然可以使用 tab 键切换到该字段,还可以选中或拷贝其文本;

让表单input等文本框为只读不可编辑的方法-转的更多相关文章

  1. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  2. HTML中让表单input等文本框为只读不可编辑的方法

    有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,如使<input type="text" name="input1" value=&qu ...

  3. HTML中让表单input等文本框为只读不可编辑但可以获取value值的方法;让文本域前面的内容显示在左上角,居中

      HTML中让表单input等文本框为只读不可编辑的方法 有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,如使input text的内容,中国两个字不可以修改   有时候,我们希望 ...

  4. Jquery学习笔记:操作form表单元素之一(文本框和下拉框)

    一.概述 在web页面开发中,经常需要获取和设置表单元素的值(如文本框中的内容),特别是在ajax应用中,更是常态.本文系统的介绍下如何操作. 同操作其它html元素一样,操作的过程差不多. 第一步, ...

  5. JQuery基础原理 与实例 验证表单 省市联动 文本框判空 单选 复选 判空 下拉判空 确认密码判等

    JQuery 基础原理 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  6. 对pdf 表单域 或文本框的操作---动态填充PDF 文件内容

    前提:需要pdf模板:并且模板内容以pdf 文本框的形式填写 package com.test;import java.io.File;import java.io.FileOutputStream; ...

  7. 将input 的文本框改为不可编辑状态

    <input type="text" id = "textid" name="名称" value="值" size ...

  8. 巧用jquery实现提交(submit)表单时候验证文本框是否为空

    http://www.cnblogs.com/wifi/articles/2387131.html 先引用jquery Html部分--------------------------------- ...

  9. html css input定位 文本框阴影 灰色不可编辑

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. MongoDB快速入门教程 (4.3)

    4.3.Mongoose模块化 4.3.1.为什么要进行模块化拆分? 模块化拆分的目的是为了代码的复用,让整个项目的结构更加清晰,举个例子:当数据库中的集合变多的时候,例如有课程.订单.分类.教师等多 ...

  2. git和github入门指南(3.1)

    3.远程管理 3.1.远程仓库相关命令 1.查看远程仓库名字,这里以github为例 git remote 上面命令执行后会得到:origin,这样一个名字,这个名字是我们克隆的时候默认设置好的 如果 ...

  3. Format中的转换说明符

    %a(%A) 浮点数.十六进制数字和p-(P-)记数法(C99)%c 单个字符%d 有符号十进制整数%f 浮点数(包括float和doulbe)%e(%E) 指数形式的浮点数[e-(E-)记数法]%g ...

  4. 从零开始用electron整个跨平台桌面应用---基础配置篇

    1.安装node.npm node以及npm都需要是最新版本(版本过低有坑) 2.安装淘宝镜像cnpm(建议,下载较快) npm install -g cnpm --registry=https:// ...

  5. object detection api调参详解(兼SSD算法参数详解)

    一.引言 使用谷歌提供的object detection api图像识别框架,我们可以很方便地重新训练一个预训练模型,用于自己的具体业务.以我所使用的ssd_mobilenet_v1预训练模型为例,训 ...

  6. P3879 阅读理解

    都这么大了,you这些怎么能算生词呢,难道三年级以前就有人做蓝题了吗(是我不配) 我觉得这道题出难一点点的话,可以整行读入什么的(口嗨怪).先看题目,对于每个生词,输出他出现在了哪些文章(需要排序). ...

  7. C++多种方法枚举串口号

    部分方式没结果,思路应该是没错. //7. std::cout << "M8: SetupDiGetClassDevs " << std::endl; // ...

  8. 性能测试之Jmeter中场景设置与启动方式

    Jmeter场景设置与启动方式 性能测试场景是用来模拟模拟真实用户操作的工作单元,所以场景设计一定要切合用户的操作逻辑,jmeter主要是通过线程组配合其他组件来一起完成场景的设置. 线程组设置 Jm ...

  9. Python——读取大文件(GB)

    最近处理文本文档时(文件约2GB大小),出现memoryError错误和文件读取太慢的问题,后来找到了两种比较快Large File Reading 的方法,本文将介绍这两种读取方法. Prelimi ...

  10. labelImg安装及使用(YOLO标签为例)

    安装: 非常简单. 第一步: cmd中执行 pip install labelImg 我一般会用下面这个 pip install -i https://pypi.tuna.tsinghua.edu.c ...