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

有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,如使input text的内容,中国两个字不可以修改
 
有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,如使<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 键切换到该字段,还可以选中或拷贝其文本,能取到里面的value值并且来用。
 
 
 
让文本域前面的内容在文本域的左上角显示:

<span style="float:left">车主评价:</span><textarea></textarea>

让文本域前面的内容居中显示:

可以通过套表格实现:

<table><tr><td><span style="float:left">车主评价:</span></td><td><textarea></textarea></td></tr></table>

 

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

  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. 让表单input等文本框为只读不可编辑的方法-转

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

  4. html5中form表单新增属性以及改良的input标签元素的种类

    在HTML5中,表单新增了一些属性,input标签也有了更多的type类型,有些实现了js才能实现的特效,但目前有些浏览器不能全部支持.下面是一些h5在表单和input标签上的一些改动. <!D ...

  5. 实现表单input文本框不可编辑的三种方法

    感谢原文作者:青灯夜游 原文链接:https://www.php.cn/div-tutorial-413133.html 目录 问题 实现方式 1.οnfοcus=this.blur() 2.read ...

  6. AngularJS中的表单验证

    AngularJS中的表单验证 AngularJS自带了很多验证,什么必填,最大长度,最小长度...,这里记录几个有用的正则式验证 1.使用angularjs的表单验证 正则式验证 只需要配置一个正则 ...

  7. jQuery学习笔记(五)jQuery中的表单

    目录 单行文本框的应用 表单验证 上次我们说完jQuery中的动画之后,我们再来看一种jQuery在Web网页应用最为广泛的一种形式,这就是jQuery对表单的操作,通过jQuery对表单的操作,可以 ...

  8. django中form表单的提交:

    一,关于表单: 表单在百度百科的解释:   表单在网页中主要负责数据采集功能.一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法. 表单域 ...

  9. HTML中的表单

    1.HTML中表单元素的基本概念 HTML表单是HTML元素中较为复杂的部分,表单往往和脚本,动态页面,数据处理等功能相结合,因此是制作动态网站很重要的内容. 表单一般用来收集用户的输入信息 2.表单 ...

随机推荐

  1. docker学习笔记-1

    docker学习笔记一:安装 mac安装docker docker官方文档上有这么一段话: Because the Docker daemon uses Linux-specific kernel f ...

  2. linux最常用命令整理

    linux vim命令跳转到文档开头或末尾 gg:命令将光标移动到文档开头 G:命令将光标移动到文档末尾 <hr/> 网络 # ifconfig # 查看所有网络接口的属性 # iptab ...

  3. Solidworks如何添加齿轮

    打开ToolBox,找到GB,动力传动,齿轮,正齿轮,然后拖放到绘图窗口(切记要在装配图里面弄,不是在单个零件里面弄)   设置齿轮的参数,一般只需要设置模数,齿数,面宽,类型,总长度(面宽就是有齿轮 ...

  4. sublime HtmlPrettify

    用sublime都快一年多了,终于找到一款称心如意的format工具,可以同时格式化 html css js. HTML-CSS-JS Prettify 如果安装的时候出现问题,多调试调试,改改参数

  5. Tomcat从零开始(十七)——StandardWrapper

    第十七课:StandardWrapper 课前复习: 不知道大家是否还有印象,就是在6.7节课说的4种container,粗略的从大到小来说就是engine,host,context,和wrapper ...

  6. python——python 数据结构之双向链表的实现

    和单链表类似,只不过是增加了一个指向前面一个元素的指针而已. 示意图: python 实现代码: #Personal Python Data Structure--PPDS # #!/usr/bin/ ...

  7. C、C++中如何成功嵌入python

    修改lib文件名称,拷贝修改C:\Python27\libs目录下原来的python27.lib为python27_d.lib 包含头文件在C:\Python27\include目录下 包含lib文件 ...

  8. LoadRunner解决超时错误

    在运行脚本回放过程中,有时会出现错误,这在实际测试中是不可避免的,毕竟自动录制生成的脚本难免会有问题,需要运行脚本进行验证,把问题都解决后才加入到场景中进行负载测试.下面结合常用的协议(如Web.We ...

  9. hdu1010Tempter of the Bone(dfs+奇偶剪枝)

    题目链接:pid=1010">点击打开链接 题目描写叙述:给定一个迷宫,给一个起点和一个终点.问是否能恰好经过T步到达终点?每一个格子不能反复走 解题思路:dfs+剪枝 剪枝1:奇偶剪 ...

  10. sklearn word2vec 实践

    源代码: https://blog.csdn.net/github_38705794/article/details/75452729 一.复现时报错: Traceback (most recent ...