H5移动端，富文本编辑器wangEditor_h5移动端富文本编辑器,h5富文本资源-CSDN下载

共23个文件

js：7个

css：6个

ds_store：4个

editor

4星 · 超过85%的资源需积分: 2 127 浏览量 2017-12-20 14:48:51 上传评论 10 收藏 372KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

wangEditor.zip （23个子文件）

wangEditor

.DS_Store 8KB

.DS_Store 6KB

mui.js 252KB

addDetails.html 4KB

rem.js 4KB

jquery.js 91KB

release

wangEditor.js 156KB

fonts

w-e-icon.woff 5KB

wangEditor.min.css 14KB

wangEditor.min.js 65KB

wangEditor.min.js.map 213KB

wangEditor.css 16KB

release

.DS_Store 6KB

wangEditor.js 156KB

fonts

w-e-icon.woff 5KB

wangEditor.min.css 14KB

wangEditor.min.js 65KB

wangEditor.min.js.map 213KB

wangEditor.css 16KB

editor.html 4KB

css

.DS_Store 6KB

app.css 72KB

mui.css 95KB

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <title>发布产品</title> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black">  <link rel="stylesheet" href="css/mui.css"> <link rel="stylesheet" href="css/app.css"> <link rel="stylesheet" href="release/wangEditor.css"> <style> #editor{ /*position: absolute; top: 0;left: 0; width: 100%; height: 100%;*/ background-color: #efeff4; -webkit-overflow-scrolling: touch; } .w-e-toolbar{ position: fixed; bottom: 0px; left:0; width: 100%; z-index: 99; height: 50px; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; } .w-e-text-container{ position: absolute; width: 100%; height: 100%; } .w-e-text{ padding: 0 0.42rem 50px 0.42rem; } .w-e-text img{ max-width: 100%; } #btn1{ position: fixed; bottom: 60px; z-index: 88888; left: 0; background: red } </style> </head> <body> <div id="editor"></div> <button id="btn1">获取html</button> <script src="js/mui.js"></script>  <script type="text/javascript" src="release/wangEditor.js"></script> <script src="js/jquery.js"></script> <script type="text/javascript"> //配置基本信息--------------------------------------------------------------------------- var E = window.wangEditor; var editor = new E('#editor'); // 或者 var editor = new E( document.getElementById('#editor') ) // 通过 url 参数配置 debug 模式。url 中带有 wangeditor_debug_mode=1 才会开启 debug 模式 editor.customConfig.debug = location.href.indexOf('wangeditor_debug_mode=1') > 0 //编辑区域的z-index默认为10000，可自定义修改，代码配置如下。需改之后，编辑区域和菜单的z-index会同时生效。 editor.customConfig.zIndex = 8 // 自定义菜单配置 editor.customConfig.menus = [ 'head', // 标题 'bold', // 粗体 'italic', // 斜体 'underline', // 下划线 'image', // 插入图片 // 'table', // 表格 // 'strikeThrough', // 删除线 'foreColor', // 文字颜色 // 'backColor', // 背景颜色 'link', // 插入链接 'list', // 列表 'justify', // 对齐方式 'quote', // 引用 // 'emoticon', // 表情 // 'video', // 插入视频 // 'code', // 插入代码 'undo', // 撤销 // 'redo' // 重复 ] // 自定义配置颜色（字体颜色、背景色） editor.customConfig.colors = [ '#000000', '#eeece0', '#1c487f', '#4d80bf', '#c24f4a', '#8baa4a', '#7b5ba1', '#46acc8', '#f9963b', '#ffffff' ] // 关闭粘贴样式的过滤 editor.customConfig.pasteFilterStyle = false // 自定义处理粘贴的文本内容 editor.customConfig.pasteTextHandle = function (content) { // content 即粘贴过来的内容（html 或纯文本），可进行自定义处理然后返回 return content; } // 配置服务器端地址 editor.customConfig.uploadImgServer = 'http://192.168.1.200:8082/APPMerchant/upload00'; editor.customConfig.uploadFileName = 'myFileName'; editor.customConfig.uploadImgParams = { token: 'abcdef12345' // 属性值会自动进行 encode ，此处无需 encode } editor.customConfig.withCredentials = true; editor.customConfig.showLinkImg = true editor.customConfig.uploadImgParamsWithUrl = false; editor.create(); //配置基本信息--------------------------------------------------------------------------- document.getElementById('btn1').addEventListener('click', function () { // 读取 html alert(editor.txt.html()) }, false) </script> </body> </html>

评论收藏

内容反馈