使用bootstrap-wysiwyg富文本编辑器

bootstrap-wysiwyg的介绍:http://www.bootcss.com/p/bootstrap-wysiwyg/ 。
bootstrap-wysiwyg的GitHub地址: https://github.com/mindmup/bootstrap-wysiwyg/ 。
如果下载了bootstrap-wysiwyg,如何使用bootstrap-wysiwyg其实可以参考index.html。

创新互联公司是一家专业提供尼元阳企业网站建设,专注与成都网站建设、网站制作、html5、小程序制作等业务。10年已为尼元阳众多企业、政府机构等服务。创新互联专业的建站公司优惠进行中。

1.样式

bootstrap-wysiwyg允许自定义工具条,本文使用bootstrap3实现样式,字体图标使用Font Awesome。
工具条使用bootstrap3的组件按钮工具栏


如果上传图片的样式有些小问题,别着急,后面的js代码会解决。
代码:









    

2.功能

本文只实现了一些基本的功能。

添加js依赖。




添加js代码。

3.使用

获取富文本编辑器的内容,和获取普通div内容一样。
$("#editor").html();
获取清除HTML标签后的内容:
$("#editor").cleanHtml();

附上效果图:
使用bootstrap-wysiwyg富文本编辑器

项目下载地址:
https://gitee.com/luckiness/bootstrap-wysiwyg-demo


分享题目:使用bootstrap-wysiwyg富文本编辑器
网页地址:http://hxwzsj.com/article/ijcsoc.html
Copyright © 2025 青羊区翔捷宏鑫字牌设计制作工作室(个体工商户) All Rights Reserved 蜀ICP备2025123194号-14
友情链接: 高端网站建设 成都网站制作 成都网站制作 成都网站制作 成都网站制作公司 成都网站制作 成都网站建设 古蔺网站建设 企业网站设计 高端品牌网站建设 手机网站制作 成都网站建设公司 成都网站设计 网站设计公司 成都网站建设 成都网站设计 营销网站建设 网站制作 温江网站设计 成都企业网站制作 定制网站设计 成都网站设计