React:获取 contentEditable div 内文本的值

2024-04-24

我正在使用一个contentEditablediv 并希望在调用提交时获取其中的文本。我试过this.refs.textarea.value.trim()但这似乎不起作用。我的代码在渲染返回中如下

<div><form onSubmit={this.handleSubmit} id="noter-save-form" method="POST">

<div id="noter-text-area" contentEditable="true" ref="textarea">{value}</div>

and the handleSubmit功能。

handleSubmit: function(e) { 
  e.preventDefault();
  var text = this.refs.textarea.value.trim();
  alert(text);
  this.saveFile(text);
},

谢谢您的帮助。我只是想用可编辑 div 中实际的内容替换文本变量。


如果它是一个div,它是否可编辑并不重要并且应该是this.refs.textarea.innerHTML如果你只想要文字this.refs.textarea.innerText

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

React:获取 contentEditable div 内文本的值 的相关文章

  • React - 如何在不使用构造函数的情况下访问道具

    注意 我在使用 React Native 时遇到了这个特定问题 但我想这也适用于 React 我有一个使用 React Component 构建的反应组件 我不需要设置状态 但我确实有道具 我建议的语法如下 class Header ext
  • 如何在reactjs中访问悬停状态?

    我有一个侧面导航 里面有很多篮球队 因此 当其中一个团队悬停在上方时 我想为每个团队显示不同的内容 另外 我正在使用 Reactjs 所以如果我可以有一个可以传递给另一个组件的变量 那就太棒了 React 组件在其顶级界面中公开所有标准 J
  • 更改元素的顺序

    我正在创建一个浮动宽度的网站 用户在智能手机上使用从全高清分辨率到约 600 像素的屏幕 这似乎是一个不错的主意 这就带来了一个非常有趣的问题 当用户使用比最佳分辨率更小的分辨率时 页面的高度会增加很多 这意味着更改某些元素 例如某些图像
  • 引导导航栏菜单与文本重叠

    我使用最新版本的引导程序 当我调整屏幕浏览器的大小时 使用小切换按钮下拉导航栏时 导航栏会重叠页面上的文本 而不是向下推页面内容 我已经多次研究过这个问题 我尝试将 padding bottom 放在导航栏上 将 padding top 放
  • 使用 highcharts 时,为什么 Bootstrap 选项卡显示宽度不正确的选项卡窗格 div?

    因此 我正在使用 Twitter 的 Bootstrap 创建一个包含选项卡式内容的页面 但我的起始活动 div 的内容始终与其他选项卡的内容不同 例如 我在不同的选项卡中使用 highcharts js 放入图表 但活动选项卡始终显示正确
  • 如何在 select2 下拉列表中换行?

    我正在使用 select 2 下拉菜单 然后在其内容中显示一些长句子 我想在句子的正确位置添加换行符 但下拉菜单是自动调整的 For example the content of the dropdown right now looks l
  • 在 React 中切换 css 类

    如何使用布尔值切换 React 中元素上 css 类的存在 在 Angular 2 中我可以这样做 class red isRed 如何在 React 中做熟悉的事情 在 React 中 元素使用如下语法获取它们的类 div div 但请注
  • 如何在有序列表中组合数字和字母?

    如何在 CSS 中用数字和字母递增有序列表 ol nested margin bottom 0 counter reset item ol nested li display block position relative ol neste
  • 自定义rc-time-picker的样式

    我在用rc time picker我的项目的包 但我在自定义样式时遇到问题pop up of my time picker成分 这是我的组件的屏幕截图 首先 我需要更改时间的背景颜色item在当时li from light grey 在屏幕
  • Django:按钮链接

    我是一名 Django 新手用户 尝试创建一个按钮 单击该按钮会链接到我网站中的另一个页面 我尝试了一些不同的例子 但似乎没有一个对我有用 举个例子 为什么这不起作用
  • yup.js 验证数字字段大于同级字段,或者可以为空

    我正在使用 Yup js 来验证一些表单字段 我有两个整数字段 Year Built Year Renovated Year Built是必填字段 Year Renovated is not 不过 装修年份可以留空如果有一个值它应该大于建造
  • 为什么我的淘汰单选按钮在另一个具有点击绑定的元素内时会失败?

    我有一个单选按钮列表 我想要点击 li 他们还检查单选按钮 这一切都有效 直到我放了一个name单选元素上的属性 然后我的代码停止工作 我的代码如下所示 ul li li ul li
  • 如何在更大的 div 中垂直和水平居中一个 div?

    如何将一个 水平居中于另一个 中 我设法使用已接受答案中的样式水平居中 我怎样才能让它垂直居中 内部 div 的高度未知 https stackoverflow com questions 114543 how to center div
  • 使用 css 简单地将对象居中,无需修改

    我想使用 CSS 将对象居中 而不需要任何技巧 这可能吗 如何实现 我已经尝试过了 但是我的 p 标签消失了 centered position fixed top 50 left 50 有多种方法可以使元素居中 但这取决于您的元素是什么以
  • 在 HTML5 画布中,如何用我选择的背景遮盖图像?

    我试图用画布来实现这一点 globalCompositeOperation 但没有运气 所以我在这里问 这里有类似的问题 但我没有在其中找到我的案例 我的画布区域中有图层 从下到上的绘制顺序 画布底座填充纯白色 fff 用fillRect
  • 刷新页面时保存用户的选择

    我目前有一个页面显示不同团队的数据 我有一些数据 用户可以单击使其处于 打开 或 关闭 状态 并为每个数据显示不同的图标 它基本上就像一个清单 只是没有物理复选框 我想记住哪些 复选框 已被选中 即使在用户刷新页面或关闭浏览器并稍后返回之后
  • 图像背景不透明度不影响边框

    如何设置背景不透明度而不影响边框线不透明度 我找到的解决方案没有帮助 div class selected img src assets img image product 1 thumbnail jpg alt product 1 thu
  • className 属性是否承担 Reactjs 中 id 属性的角色?

    由于 id 属性在 Reactjs 组件中很少使用 因为 id 属性意味着组件不会被重用 那么是否使用 className 属性来代替 id 呢 如果是这样的话 那么 Reactjs 中相当于 HTML 中的 class 属性的是什么 cl
  • Cypress 在 Create React App 中返回 .scss 文件的 webpack 编译错误

    我正在尝试将 Cypress 添加到非常基本的 CRA 但遇到了 Cypress 无法理解 scss 文件的问题 当我跑步时npm run cypress运行测试 我收到以下错误 Error Webpack Compilation Erro
  • 如何在执行新操作时取消先前操作的执行?

    我有一个动作创建器 它会进行昂贵的计算 并在每次用户输入内容时调度一个动作 基本上是实时更新 但是 如果用户输入多个内容 我不希望之前昂贵的计算完全运行 理想情况下 我希望能够取消执行先前的计算并只执行当前的计算 没有内置功能可以取消Pro

随机推荐

  • 如何以百分比形式获取mysql匹配结果?

    我在用匹配 Col1 对阵 Val 在mysql中 select match body against body var from articles 现在 如果完全匹配 我将得到数字形式的结果 例如 14 43 这个数字是什么意思 主要问题
  • B2C 和 Azure 应用服务的 CORS 问题

    我通过在控制器中使用 AddCors 和 EnableCors 在我的 ASP NET Angular 应用程序中启用了 CORS 我的应用程序正在与 AD B2C 页面进行通信 构建后 我在控制台中出现此错误 访问 XMLHttpRequ
  • 如何在 ChartJS 2.0 中隐藏超出 x 轴的值?

    如何在 ChartJS 2 0 中隐藏超出 x 轴的值 您会注意到图表突出超过了 60 标记 x 轴使用时间刻度 我设置了最大值和最小值 这是我的图表配置 type line data datasets label Scatter Data
  • 获取纸张下拉菜单的选定值

    我用的是聚合物paper dropdown menu https www polymer project org 0 5 docs elements paper dropdown menu html作为我的项目的下拉菜单 现在 当用户从下拉
  • Android 分辨率和模拟器未选择正确的图像

    我有一个关于 Android 分辨率及其在模拟器上如何表示的快速问题 我已经建立了一个测试项目来测试许多不同的分辨率以及它们在每个方向上的外观 所以我创建了drawable land ldpi mdpi hdpi xhpdi并对drawab
  • 使用 Intellij 调试 Scala 宏

    我有一个 sbt 项目 我运行 gen idea 来设置它以与 Intellij 12 4 一起使用 在一个项目中是我的主代码 另一个项目中有我的宏代码 当尝试通过以下测试文件调试我的宏时http docs scala lang org o
  • 创建一个新的颜色可绘制对象

    我正在尝试将十六进制值转换为整数 以便我可以创建一个新的颜色可绘制对象 我不确定这是否可能 但根据文档 https developer android com reference android graphics drawable Colo
  • getApplication() 与 getApplicationContext()

    我找不到令人满意的答案 所以我们开始 这是怎么回事Activity Service getApplication and Context getApplicationContext 在我们的应用程序中 两者都返回相同的对象 在一个Activ
  • 大数据库用什么DB?

    我正在着手一个项目 在不久的将来可能会跨越数百万行 所以我正在研究我使用的数据库 因为这肯定会证明是一个问题 据我所知 一旦表的行数达到 2 000 000 行 SQL 的所有版本都会出现问题 对于这些大型项目有推荐的好数据库吗 这是我正在
  • 为什么 Python 3 http.client 比 python-requests 快这么多?

    我今天测试了不同的 Python HTTP 库 我意识到http client https docs python org 3 library http client html库的执行速度似乎比requests http docs pyth
  • C 中指针的冒泡排序,输入末尾的预期声明或语句

    我尝试使用指针引用数组元素来实现冒泡排序 而不是使用数组索引 void bubble p long long int main long count 10 int i long data 5 2 1 7 10 6 8 4 9 0 bubbl
  • 缺少 Haskell 原语来连续将函数应用于列表的每个元素?

    在 Haskell 中 众所周知map原语可用于将给定函数应用于all列表的元素 gt map toUpper abcd ABCD gt 在尝试生成有限集 列表 的所有分区时 以下类似的原语会很方便 gt sap toUpper abcd
  • MySQL 中的一对多查询

    在 MySQL 中查询一对多的最佳方式是什么 这是我正在开发的数据库的简化版本 如果有什么看起来不对劲告诉我 CREATE TABLE Tenant tenant id int NOT NULL first name varchar 20
  • JAVA 中的四舍五入

    我想四舍五入 ex 的值 12 166666 gt 12 00 12 49999 gt 12 00 12 5111 gt 13 00 12 9999 gt 13 00 我想将 50 派塞四舍五入 你可以看看Math round double
  • 在cocos2D游戏环境中应用缩放效果?

    我正在开发一款游戏cocos2D游戏引擎并加载所有sprites当它加载关卡时 现在因为一些sprites 障碍物 高于 320 像素 因此看起来很难检查出来 所以为了方便起见我想申请ZOOM IN and ZOOM out效果 一次最小化
  • C# 动态创建 LinkBut​​ton 命令事件处理程序

    所以我这里有一个奇怪的情况 我有一个 System Web UI WebControls WebParts EditorPart 类 它呈现一个 搜索 按钮 当您单击此按钮时 它的 clickHandler 方法会执行数据库搜索 并为其返回
  • ND 输入的 im2col 算法

    我正在尝试为输入维度 gt 2D 编写自己的 im2col 算法 目前我正在研究 Matlab im2col 的实现 但是 我找不到任何有关二维以上输入的情况的文档 如果我将 3D 张量输入到函数中 我确实会得到输出 不过我不太明白你是如何
  • 使用 javascript 下载时 PDF 为空

    我有一个 Web 服务 可以在其响应中返回 PDF 文件内容 当用户单击链接时 我想将其下载为 pdf 文件 我在UI中编写的javascript代码如下 http get http MyPdfFileAPIstreamURl then f
  • 播放声音 Javascript/Jquery

    我正在构建一个基于 Ajax 的应用程序 它将在我们的本地 Intranet 网络上运行 现在 每次 Ajax 返回请求时 我都需要在客户端浏览器中播放声音 我想将声音文件 mp3 wav 放入我的 Web 服务器 Tomcat 目录中 应
  • React:获取 contentEditable div 内文本的值

    我正在使用一个contentEditablediv 并希望在调用提交时获取其中的文本 我试过this refs textarea value trim 但这似乎不起作用 我的代码在渲染返回中如下 div div