`
geeksun
  • 浏览: 965333 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js两种只读实现方式

阅读更多

想让input框的值为只读,有两种实现:

document.getELementById(textId).disabled=true; 
document.getELementById(textId).readOnly=true;

第一种input的值变成灰色,第二种input的值的颜色正常显示。

分享到:
评论

相关推荐

    设置checkbox为只读(readOnly)的两种方式

    方式一: checkbox没有readOnly属性,如果使用disabled=“disabled”属性的话,会让checkbox变成灰色的,用户很反感这种样式可以这样让它保持只读: 设置它的onclick=”return false” js里就是 checkbox.onclick=...

    js禁止使用退格键

    ### 禁止使用退格键的JavaScript实现 在网页应用开发中,有时为了保护用户数据的安全性或防止误操作,我们需要对用户的某些输入行为进行限制。比如,在表单填写过程中,可能不希望用户能够通过退格键(Backspace)...

    asp.net 实现下拉框只读功能

    在***中实现下拉框(标签)的只读功能,可以通过HTML和JavaScript两种主要方法来完成。由于下拉框的只读并非是其内置属性,因此需要通过额外的编码工作来实现。接下来,我们将详细探讨这两种实现方式。 首先,直接...

    基于 ElementPlus 的表单只读态控件,完美适配所有表单组件支持 npm 与 cdn 方式的引入

    4. **引入方式**:项目可以有两种方式引入这个组件,一是通过 `npm` 安装,另一种是直接使用 `cdn`。对于 `npm` 方式,首先需要在项目中安装 ElementPlus 和自定义组件的依赖,然后在代码中导入并注册组件。对于 `...

    怎样通过disabled和readonly将input设置为只读效果.docx

    Disabled 和 Readonly 是两种常见的方法来实现 Input 只读效果,它们均可以使 Input 变为不可编辑状态,但它们之间存在着重要的区别。 Disabled 方法 Disabled 属性用于指定 Input 元素是否可用。当 Input 元素...

    html 文本框(text)不可用只读的多种实现方法

    两种写法效果相同,`readonly="true"`是冗余的,因为`readonly`本身就是布尔属性,只要有这个属性存在,其默认值就是`true`。 ### 方法三:CSS隐藏 通过设置`style="display:none"`,可以将文本框完全隐藏,虽然...

    JS 手机转屏实现

    这里有两种常见的方式: 1. **通过 JavaScript 动态设置 class**: ```css .portrait body div { border: 1px solid blue; } .landscape body div { border: 1px solid yellow; } ``` 2. **使用媒体...

    JS中关于document.all的详解

    这里展示了两种获取表单的方式,第一种仅适用于IE浏览器,而第二种则是标准方法,兼容性更好。 ##### 示例2:修改元素样式 ```javascript var divId = document.all["divId"]; divId.style.display = "none"; ...

    HTML实现文本框只读不能修改其中的内容

    实际上,根据不同的业务场景和需求,开发者可以选择最适合的实现方式。对于需要展示数据但不允许用户更改的场景,`readonly`或`disabled`都是不错的选择。如果需要在客户端进行操作阻止用户编辑,那么使用`onfocus=...

    C#与常用的JS(包含常用的c#操作JS)

    在IT行业中,C#与JavaScript(JS)是两种非常重要的编程语言,分别在服务器端和客户端发挥着关键作用。在Web开发中,它们经常结合使用,以实现丰富的用户交互和高效的后端处理。以下是对标题和描述中涉及的知识点的...

    js 禁用只读文本框获得焦点时的退格键

    需要注意的是,这段代码使用了两种阻止事件传播的方法:`event.stopPropagation()` 和 `event.cancelBubble = true`。前者是现代浏览器的标准方法,后者则用于兼容旧版IE浏览器。同样,`event.returnValue = false`...

    精通 JS正则表达式

    在JavaScript中,可以通过两种方式创建正则表达式:一种是使用`RegExp`构造函数,另一种是使用正则表达式字面量。通过`RegExp`构造函数创建正则表达式时,需要提供两个参数:一个是正则表达式的文本内容,另一个是可...

    javaScript验证

    在HTML页面中使用JavaScript有两种方式: 1. **内联方式**:将JavaScript代码直接写在HTML文件的`<script>`标签中。 2. **外部链接**:通过`<script>`标签的`src`属性引用外部的.js文件,使代码组织更清晰。 ...

    JavaScript 使用技巧.md

    `Set` 和 `Map` 是 ES6 引入的两种新的数据结构,其中 `Set` 保证了集合中元素的唯一性,而 `Map` 提供了键值对存储的能力,并且键可以是任意类型的值。 **示例代码:** ```javascript const set = new Set([1, 2,...

    cpp-一个微小的ECMAScriptJavaScriptJS引擎

    这个引擎的极小内存需求表明它是为了高效利用这两种资源而优化的。 5. **轻量化实现**: 这个引擎通过删除不必要的功能和优化代码,实现了在8kB ROM和1kB RAM中的运行。这可能意味着它没有实现完整的ES规范,但保留...

    JavaScript试题集

    - 在HTML文档中,可以通过两种方式引入JavaScript代码:内联式和外部式。 - **内联式**:将JavaScript代码直接写在HTML标签内,如使用`onclick`属性触发事件。 - **外部式**:将JavaScript代码写在一个单独的.js...

    JavaScript面试题集锦

    "use strict"是ECMAScript 5添加的一种严格模式,使得JavaScript在更严格的条件下运行,消除JavaScript语法的一些不合理、不严谨之处,减少一些怪异行为。使用use strict模式可以使JS编码更加规范化,消除一些糟糕的...

    JavaScript5.rar

    2. **数据类型**:JavaScript有七种数据类型,包括两种原始类型(Undefined、Null、Boolean、Number、String、Symbol(ES6新增)和BigInt(ES10新增))以及一种引用类型(Object)。在ES5中,没有显式的强类型转换...

Global site tag (gtag.js) - Google Analytics