使用 textarea

wangEditor 从v3版本开始不支持 textarea ,但是可以通过onchange来实现 textarea 中提交富文本内容。

    <div id="div1">
<p>欢迎使用 <b>wangEditor</b> 富文本编辑器</p>
</div>
<textarea id="text1" style="width:100%; height:200px;"></textarea> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="../wangEditor.js"></script>
<script type="text/javascript">
var E = window.wangEditor
var editor = new E('#div1')
var $text1 = $('#text1')
editor.customConfig.onchange = function (html) {
// 监控变化,同步更新到 textarea
$text1.val(html)
}
editor.create()
// 初始化 textarea 的值
$text1.val(editor.txt.html())
</script>

富文本编辑器--使用textarea即时更新文本域同步编辑器内容的更多相关文章

  1. 使用div模拟textarea,实现文本输入框高度自适应(附:js控制textarea实现文本输入框高度自适应)

    一.使用textarea标签进行多行文本的输入有很多限制,比如不能实现高度自适应,会出现难看的滚动条等问题. HTML5中添加了一个新属性contenteditable,该属性可以让input,tex ...

  2. html5 表单 填表 select 下拉 textarea多行文本 output Js计算结果

    <select>     下拉 <select>下有很多属性 name        其实有name就有value了,因为button提交的都是? name=value的格式, ...

  3. textarea高度随文本内容变化,且不出现滚动条

    通常文本域的写法如下 <textarea type="text" class="form-control pull-left" id="desc ...

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单:文本框(Textarea)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. js/jquery获取文本框的值与改变文本框的值

    我们就用它来学习获取文本框的值及改变文本框的值. 代码如下 复制代码 <script>function get1(){ document.getElementById("txtb ...

  6. 最好的文本框样式 最漂亮的文本框样式 textbox css样式

    输入框景背景透明: <input style="background:transparent;border:1px solid #ffffff"> 鼠标划过输入框,输入 ...

  7. GUI编程笔记(java)07:GUI把文本框的值移到文本域案例

    1.首先我们了解一下我们的需求,如下: 输入“风清扬”,点击“数据转移”,这样的文本会出现到下面的文本域中,这就是我们的需求. 2.代码如下: package cn.itcast_05; import ...

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

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

  9. [Xcode 实际操作]九、实用进阶-(14)使用富文本CoreText框架创建丰富多彩的文本

    目录:[Swift]Xcode实际操作 本文将演示如何使用富文本CoreText框架创建丰富多彩的文本图形. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] imp ...

随机推荐

  1. Linux命令之文件和目录操作命令(一)—— ls

    本文介绍了ls命令的最常用法. 1.用法: ls [选项][目录名或文件名] 2.选项: -l 使用长格式显示目录或文件的详细信息 -a 显示隐藏文件 -h 人性化显示文件或目录的大小 -d 显示目录 ...

  2. 大数相乘 java

    <pre name="code" class="java">package bigMultiply; import java.math.BigInt ...

  3. LC 667. Beautiful Arrangement II

    Given two integers n and k, you need to construct a list which contains n different positive integer ...

  4. GitHub:Facebook

    ylbtech-GitHub:Facebook 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部 1. https://github.com/facebook 2. ...

  5. 淘宝TAE平台定时任务包的部署步骤

    淘宝TAE平台定时任务包的部署: 第一步:首先把自己的任务打包成一个jar包.使用maven打包的命令为:mvn clean install 第二步:把任务jar包依赖的jar包全部导出来.使用mav ...

  6. webrtc实现点对点视频通讯

    html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  7. DES加密解密工具

    using System; using System.Text; using System.Security.Cryptography; using System.IO; namespace DESP ...

  8. react 添加代理 proxy

    react package.json中proxy的配置如下 "proxy": { "/api/rjwl": { "target": &quo ...

  9. 【AMAD】salabim -- Python中进行离散事件模拟

    简介 用法 个人评分 简介 salabim1是用来定义离散事件模拟(DES2),以及转换为动画的一个python库. 用法 请看官方文档3. 个人评分 实用性是基于对平均群众的,大多数人还是接触不到这 ...

  10. MATLAB2014b parpool 报错,并行工具无法开启解决方法

    笔者一直在用matlab2014b,第一次使用并行工具parpool,但在运行别人的程序的过程中一直出现一个错误: Starting parallel pool (parpool) using the ...