富文本(wangEditor框架)的使用教程

2018-06-24 02:22:40来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

富文本的使用教程(wangEditor框架

  一,相信很多人用过很多富文本的框架,现在我向大家推荐一个很实用的一个富文本框架,具有丰富的功能项,容易使用。

    所以本博客介绍这个富文本编辑器的使用哈!觉得写得不错的请点赞哈,有建议欢迎提哈!^V^

    · 官网地址:ttp://www.wangeditor.com/

  二,控件展示效果

          haha 是不是很强大

 

  三,使用步骤

      所需js  css包:

    

      wangEditor.min.css
      wangEditor.min.js

   1,第一步就是引入js和css包了,必需的

<link rel="stylesheet" type="text/css" href="/css/wangedit/wangEditor.min.css">
<script src="/js/wangedit/wangEditor.js"></script>

   

 

    2,初始化富文本框的js代码

<script>
  var editor1 = new wangEditor("introduce1");
    editor1.config.uploadImgUrl = "/imgView/uploadTmpImg/public.htm";//富文本上传图片的路径,不上传图片这里可以忽略
    editor1.config.menuFixed = false;
    editor1.create();
</script>

 

   3,HTML代码

<div id="introduce1" style="height:300px;"></div>

  4,获得文本框的内容方法

editor1.html();//得到内容

 

    不足之处请给予指正谢谢?

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:页面旋转动画效果

下一篇:前端性能优化整理