开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

为什么用javascript将textarea切换为readonly属性会受到警告提示的影响？

使用JavaScript将textarea切换为readonly属性会受到警告提示的影响，是因为readonly属性指定了textarea元素为只读，用户无法编辑其中的文本内容。然而，当用户尝试在只读的textarea中进行编辑时，浏览器会发出警告提示。

这种警告提示的目的是为了提醒开发者和用户，该textarea元素已被设置为只读，不应该进行编辑操作。这样可以防止用户无意中修改了只读的文本内容，从而保护了数据的完整性和准确性。

在实际应用中，如果需要将textarea设置为只读，可以通过以下方式避免警告提示的影响：

使用JavaScript动态设置readonly属性：在需要将textarea设置为只读的时候，通过JavaScript代码动态地将readonly属性设置为true，而不是直接在HTML标签中写死readonly属性。这样可以避免浏览器的警告提示。
使用CSS样式控制只读外观：通过CSS样式设置textarea的外观，使其看起来像是只读的，但实际上仍然可以编辑。这样可以绕过浏览器的警告提示，同时实现只读的效果。

需要注意的是，以上方法只是绕过了浏览器的警告提示，但并没有真正地将textarea设置为只读。如果需要确保数据的不可编辑性，建议在后端进行验证和处理，或者使用其他更适合的HTML元素来展示只读的文本内容。

腾讯云相关产品和产品介绍链接地址：

腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
腾讯云云原生容器服务（TKE）：https://cloud.tencent.com/product/tke
腾讯云云数据库 MySQL 版（CDB）：https://cloud.tencent.com/product/cdb
腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

表单脚本

刚开始人们使用JavaScript，最主要的目的之一就是表单的验证，分担服务器处理表单的责任。虽然现流行的大部分提交方式是通过ajax，但了解表单，对于ajax方式也是有重大帮助的！所以，大家不要看轻表单。

04

【JS】牛客专项练习02

Readonly和Disabled是用在表单中的两个属性，它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别，总结如下：

01

腾讯网新闻底层页无障碍代码细节

本文主要介绍了腾讯网新闻底层页无障碍阅读功能，该功能主要针对于盲人用户使用屏幕阅读器进行阅读而设计。主要优化了以下六个方面：1. 添加无障碍说明，使代码做为body的第一个元素，使用css样式代码控制此代码中的内容在视觉上不显示，只有使用屏幕阅读器才可以听到这个链接；2. 为页面中指向网站首页的链接添加title和accesskey属性，使按alt+1快捷键时可以阅读该title和链接地址；3. 为页面中的主导航所在代码区域添加accesskey和tabindex属性，使按alt+2快捷键时可以阅读该区域的内容；4. 为文字的正文区域添加title和accesskey属性，使按alt+3快捷键时可以阅读该区域的内容；5. 为评论的出入框添加accesskey属性，使按alt+4快捷键时可以阅读该区域的内容；6. 在鼠标在某个拥有title属性的区域时候，会出现悬停的小菜单提示，使用javascript脚本实现。该功能默认此区域的title值为空，当按下某快捷键的时候，对该快捷键绑定的区域进行动态的赋予title的值。

01

KindEditor的简单使用

KindEditor 是一套开源的在线HTML编辑器，主要用于让用户在网站上获得所见即所得编辑效果，开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富文本输入框。 KindEditor 使用 JavaScript 编写，可以无缝地与 Java、.NET、PHP、ASP 等程序集成，比较适合在 CMS、商城、论坛、博客、Wiki、电子邮件等互联网应用上使用。

03

表单 <form> 相关

action 表示处理此表达信息的程序所在的URL,所述表单信息在提交时被发送到定义的地址。

03

前端必读：Vue响应式系统大PK（下）

在上节中我们对Vue2和Vue3中的响应式系统做了对比，带大家了解了响应式系统的工作原理，今天我们来进一步探索Vue3中的响应式系统API，为了让大家更好的理解和学习，将方法分组进行归纳。

02

让你的iOS应用程序支持运行JavaScript脚本：JavaScriptCore框架详解

说到JavaScript脚本，iOS开发者都会想到一个名叫JavaScriptCore的框架。这个框架的确十分强大，其中封装了一套JavaScript运行环境以及Native与JS数据类型之间的转换桥梁。本篇博客主要讨论如何使用此框架来在iOS应用中运行JavaScript脚本。

03

「译」利用 JavaScript 复制文本到剪贴板

一个小小的诀窍。实现主题的复制代码功能时，思路刚好和这篇文章差不多，不过这篇文章的代码要更加合理。

02

纯CSS实现拖拽--resize、scale、包裹性

今天看了一篇关于 CSS 的文章，文章用到的几个点，想和大家聊聊。附「原文地址」大家可自己查阅。

02

JavaScript禁用浏览器后退按钮

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

03

纯CSS实现拖拽--resize、scale、包裹性

今天看了一篇关于 CSS 的文章，文章用到的几个点，想和大家聊聊。附「原文地址」大家可自己查阅。

01

IOS系统input输入框为readonly时，隐藏键盘上的上下箭头

业务中在一定场景中会将input 设置为只读状态，在IOS safari上当input 输入框focus 时，仍会出现键盘上的上下箭头，这种用户体验非常不好，如何干掉呢？

03

阿里前端面试问到的vue问题

虽然文档不建议在应用中直接使用 mixin，但是如果不滥用的话也是很有帮助的，比如可以全局混入封装好的 ajax 或者一些工具函数等等。

05

readonly 和 disable的区别

readonly和disabled它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别，总结如下： Readonly只针对input(text / password)和textarea有效，而disabled对于所有的表单元素都有效，但是表单元素在使用了disabled后，当我们将表单以POST或GET的方式提交的话，这个元素的值不会被传递出去，而readonly会将该值传递出去（readonly接受值更改可以回传，disable接受改但不回传数据）。一般比较常用的情况是：

04

Ext实现滚动条一直处于底部的方法

在我们的实际开发应用中，经常会使用到ext的常用控件textarea。对于一些form表单，录入信息的备注，简介等等信息较多的时候就会使用的textarea。最近在所一个全网拓扑图的时候，以及网络诊断ping，telnet连接测试等等功能的时候，出现了一些比较辣手的问题。就是通过ajax请求后台数据后，把新数据动态的显示到textarea中，textarea的滚动条不会定位到最底部。始终显示在top的位置。经过研究发现，ext对自身的textarea进行了封装，使用table布局。我们根据getCmp()方法获取的控件对象实际上是一个table，这是我们在对table设置它的scrollTop和获取它的scrollHeight属性都会失败。而我们真正需要的是textarea本身，而不是它的父组件table。

03

Vue.js渐进式JavaScript框架

vue.js拥有更小的体积，压缩后的vue.js就只有33k；vue.js拥有更高的运行效率，vue.js是基于虚拟dom的，虚拟dom是一种可以预先通过JavaScript进行各种计算，把最终的dom操作计算出来并进行优化的技术。

02

WKWebView详解

WKWebView主要涉及到以下类或协议，各部分可能互相依赖，文章按照apple文档的划分对每一个模块进行了详细的解释。

最新版教学Vue.js渐进式JavaScript框架

vue.js拥有更小的体积，压缩后的vue.js就只有33k；vue.js拥有更高的运行效率，vue.js是基于虚拟dom的，虚拟dom是一种可以预先通过JavaScript进行各种计算，把最终的dom操作计算出来并进行优化的技术。

02

JS魔法堂：被玩坏的innerHTML、innerText、textContent和value属性

一、前言　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　由于innerText并非W3C标准属性，因此我们无法在FireFox中使用它(修正：FF45+已经支持innerText属性)，一般情况下我们可以使用textContent来代替，但它两者是否就能完全等同呢？在坑爹的表单元素（如input、textarea等）中表现是否依旧诡异呢？文本将记录一些实验结果，避免日后被玩坏。二、innerHTML　　　　　　　　　　　　　　　　　　　　　　　　　　由于innerText和text

07

字节前端一面常见vue面试题（必备）_2023-02-28

Vue 的编译过程就是将 template 转化为 render 函数的过程分为以下三步

03

html教程之form表单元素

<form action="post.php" method="post" target="_self" autocomplete="off" enctype="multipart/form-data" >

01

表单

1.表单控件 1.input标记 1.input标记提供文本输入框，密码输入框，按钮，单选按钮，多选按钮，文件上传框，隐藏域 2.属性 type:类型根据不同的type值，创建不同的输入框 value：输入框的值 name:给输入框起个名字(必须要写) disabled：禁止 3.具体的表单type值 1.文本框 <input type="text"/> 属性: value：输入框的值 maxlength:允许输入的最大长度 readonly:只读 2.密码框 <input type="password"/> 属性: value：输入框的值 maxlength:允许输入的最大长度 readonly:只读 3.单选框 <input type="radio"/> 属性 name属性的值必须一样(必须要加) checked:选中 4.多选框 <input type="checkbox"/> 5.按钮 1.普通按钮:button <input type="button" value="普通按钮"/> value属性 2.提交按钮:submit <input type="submit" value="提交按钮"/> 3.重置按钮:reset <input type="reset" value="重置按钮"/> 6.文件上传框:file <input type="file"/> 2.<textarea></textarea>标记 1.多行文本框 2.语法 <textarea></textarea> 3.属性 name:命名 cols:代表多少列 ----输入框显示做多显示列数 rows:代表多少行 ----输入框显示做多显示行数 readonly:只读 ---- 输入框的内容无法输入 3.select下拉标记 1.语法

03

6.HTML输入表单标签元素介绍

描述: 表单是一个包含表单元素的区域，表单元素是允许用户在表单中输入内容,其包含文本框、文本域(textarea)、按钮、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等元素都要放在form标签里面或者进行form的id值的调用，否则提交的数据到不了后端。

01

使用 JS 剪贴板 API

使用 JS 剪贴板 API 现在的状况一般情况下我们会在网页上使用大量的3复制粘贴的操作。但是也可以看到在 360文库中的禁止复制粘贴或者知乎的那样复制粘贴的时候会自动带有一段文字的版权声明。 C

02

1.1、文本插值

Vue 使用一种基于 HTML 的模板语法，使我们能够声明式地将其组件实例的数据绑定到呈现的 DOM 上。所有的 Vue 模板都是语法层面合法的 HTML，可以被符合规范的浏览器和 HTML 解析器解析。

02

JS 实现复制粘贴功能

接下来，介绍他的使用方式，前提条件，下载clipboard.min.js插件，下载地址：在这里

03

Web App 相关技术

上面这个 slide 资料讲的非常好，算是一个入门的介绍吧。带我们建立基本的移动 web 开发知识体系和常见问题的实践。包含以下几个方面：

03

表单常用的控件有哪些_html表单控件样式修改

readonly属性规定输入字段为只读（不能修改）； readonly属性不需要值，它等同于readonly=“readonly”。

02

面试官：你有写过自定义指令吗？自定义指令的应用场景有哪些？

指令系统是计算机硬件的语言系统，也叫机器语言，它是系统程序员看到的计算机的主要属性。因此指令系统表征了计算机的基本功能决定了机器所要求的能力

02

Web页面组成

https://blog.csdn.net/chenmozhe22/article/details/80035871

02

【React】345- React v16.9 新特性[译]

今天我们发布了 React 16.9。它包含了一些新特性、bug修复以及新的弃用警告，以便与筹备接下来的主要版本。

04

【译】JavaScript实现文字剪贴板&React版本

目录怎么使用JavaScript实现一个剪贴上面的方法不是很完美我们优化一下思考一个问题使用react和typescript重写和优化一下如何使用copyme 原文参考写在最前面有一个简单的需求，用户需要快捷的复制一些相关的信息，然后进行下一步信息的填写。前端这里需要做一个剪贴板方便用户体验。想直接参考 react 使用的可以看使用react和typescript改写和优化一下大概设计如下，有多条信息，然后用户可以点击右边的复制 icon 进行快捷的复制。 📷 怎么使用JavaScr

02

常用的web方法 web API(二)

在上一篇《常用的web方法 web API(一)》中我们学习了：绑定事件的几种方式、解绑事件的几种方式、创建元素的几种方式、获取节点的几种方式本篇我们将继续学习：轮播图的js方法、offset系列相关属性、scroll系列属性、client系列以及获取元素计算后的样式属性值。好了，接下来我们接着学习：

03

4000字讲清《深入理解TypeScript》一书【基础篇】

这三点我认为是最关键的点，本身TypeScript能做的事情，JavaScript都能做，虽然使用TS要多写很多代码，但是其实真正算下来，是可以节省大量时间，因为你在编写的时候就能知道哪里有问题。

03

前端javascript如何阻止按下退格键页面回退但不阻止文本框使用退格键删除文本

这种写法虽然屏蔽了回车键页面回退的功能，但同样，如果该页面有文本输入框，那么这个输入框将不能使用退格键进行文本删除；

03

JS前端技术类文章

注意，装饰器对类的行为的改变，是代码编译时发生的，而不是在运行时。这意味着，装饰器能在编译阶段运行代码。也就是说，装饰器本质就是编译时执行的函数。

02

百度前端一面高频vue面试题汇总_2023-02-28

递归组件编译结果中，获取组件时会传递一个标识符 _resolveComponent("Comp", true)

01

angularJS学习之路（六）---指令

一个东西需要说明：根据HTML标准，布尔属性代表一个true或者false值，当这个属性出现的时候，这个属性的值就是true，无论实际值是什么，如果未出现，这个属性的值就是false

02

JavaScript 编程精解中文第三版十八、HTTP 和表单

我们曾在第 13 章中提到过超文本传输协议（HTTP），万维网中通过该协议进行数据请求和传输。在本章中会对该协议进行详细介绍，并解释浏览器中 JavaScript 访问 HTTP 的方式。

02

Vue入门（一）——基本概念

Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统。

01

探索前端内容保护

在部分网站CV别人代码或是一段文字时，经常遇到无法选中，或许选中之后，复制时弹出提示让登录/关注。常常让我们感到无奈，那么这是怎么做到的呢？

03

document.activeElement 过滤选择文件弹窗导致的页面失焦

本文很简单，其实就是 document.activeElement 的使用，获取当前页面上的焦点元素

02

vue3之糟糕透顶Api——Reactivity

Reactivity可以说是vue3中最复杂的一个地方，当然也是功能最强大的一个点，听起来是块硬骨头哈🍖，这让我想起亮剑中李云龙面对小日本挑衅说的话：就是阎王爷来了，我也得搂他几根胡子下来。那么今天咱们也搂搂Reactivity的胡子。在vue3当中，它是把数据响应式Api全都暴露出来了，在vue2中是没有这样做的，那vue2是怎么做的呢？它是将数据配置到data当中，data中的数据会自动变成响应式数据，我们把这个过程叫做注入，它会注入到组件实例当中去，如下： { //data中的数据都是响应

03

Vue成神之路之内部指令

vue.js——开发版本：包含完整的警告和调试模式 vue.min.js——生产版本：删除了警告，进行了压缩

05

如何实现文本内容折叠并显示“...查看全部”？

多行文本超过指定行数隐藏超出部分并显示“...查看全部”是一个常遇到的需求，网上也有人实现过类似的功能，不过还是想自己写写看，于是就写了一个vue的组件，本文简单介绍一下实现思路。

02

2023前端二面必会vue面试题指南4

早期的前端路由的实现就是基于 location.hash 来实现的。其实现原理很简单，location.hash 的值就是 URL中 # 后面的内容。比如下面这个网站，它的 location.hash 的值为 '#search'

03

React V16.9来了无痛感升级加入性能检测【译-真香】

React 16.9不包含重大更改，旧版本名称在此版本中继续有效。但是，当您使用任何旧名称时，您将看到警告：

03

使用 CodeMirror 打造属于自己的在线代码编辑器

写这个的目的是因为之前项目里用到过 CodeMirror，觉得作为一款在线代码编辑器还是不错，也看到过有些网站用到过在线代码编辑，当然我不知道他们是用什么做的，这里我把公司项目里用到的那部分抽出来，单独写篇博客，并把抽出来的那部分代码提交到 GitHub 去（地址），以防日后可能会再次用到（没准毕业设计里可能用的到）。

00

codemirror自定义代码提示_96图文编辑器

写这个的目的是因为之前项目里用到过 CodeMirror，觉得作为一款在线代码编辑器还是不错，也看到过有些网站用到过在线代码编辑，当然我不知道他们是用什么做的，这里我把公司项目里用到的那部分抽出来，单独写篇博客，并把抽出来的那部分代码提交到 GitHub 去

02

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭