h5 富文本编辑器

第一种:wangEditor(地址:https://www.kancloud.cn/wangfupeng/wangeditor3/332599

首先需要引入js

<script type="text/javascript" src="https://unpkg.com/wangeditor@3.1.1/release/wangEditor.min.js"></script>
 
其次在页面中定义
<div id="editor"> </div>
 
然后在js中
<script type="text/javascript">
    var E = window.wangEditor
    var editor = new E('#editor')
    // 或者 var editor = new E( document.getElementById('editor') )
    editor.create()
 
    console.log(editor.txt.text())//获取富文本编辑器的值
</script>
 
第二种:ueditor (最新版地址:http://ueditor.baidu.com/website/download.html#ueditor)
百度网盘中有
 
第一步:引入文件
<script type="text/javascript" charset="gbk" src="ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="gbk" src="ueditor/ueditor.all.min.js"></script>
 
第二步:html文件
<script id="editor" type="text/plain" style="width:400px;height:300px;"></script>
 
第三步:js
<script type="text/javascript">
        //实例化编辑器
        var ue = UE.getEditor('editor', {
            initialFrameWidth: 800,
            initialFrameHeight: 400,
            autoFloatEnabled: false,
            autoHeightEnabled: false,
            elementPathEnabled: false,
            enableAutoSave: false
        });
</script>

posted on 2019-11-13 16:58  旺仔小裤头  阅读(6723)  评论(0编辑  收藏  举报