极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg

网络编程 2024/9/1 佚名

3 2 1

先来看看官方对这款编辑器的相关功能描述吧。

1、在Mac和Wndows平台上能够自动针对常用操作绑定标准热键

2、可以通过拖拽插入图片；支持图片上传（也可以获取移动设备上的照片）

3、语音识别输入（仅限Chrome浏览器）

4、允许自定义工具条；不生成额外标签；支持网站充分利用Bootstrap、Font Awesome等工具库的优秀特性

5、没有强制规定的样式一切都由你做主

6、依赖浏览器的标准特性，没有非标准代码；工具条和键盘功能均可定制，并且能够执行任何浏览器支持的命令

7、不会自己创建一个单独的frame、备份文本区等本编辑器尽量保持简单，并仅仅运行在一个DIV内

8、（可选）清除尾部空格；清除空的div和span

9、必须运行在现代浏览器上（在Chrome 26、Firefox 19、Safari 6上经过测试，用户报告称可以在IE10上工作）

10、支持移动设备浏览器（在IOS 6 Ipad/Iphone 和 Android 4.1.1 Chrome上测试过）

注意：wysiwyg 和 wysihtml5 是两款不同的编辑器。 wysiwyg 是对 wysihtml5 的一种加强版，比较相似。所以大家可以根据自己的需要去使用。
wysiwyg 官网：http://mindmup.github.io/bootstrap-wysiwyg/
wysiwyg 中文网站：http://www.bootcss.com/p/bootstrap-wysiwyg//
wysihtml5 官网：http://jhollingworth.github.io/bootstrap-wysihtml5/
由于 wysiwyg 是对 wysihtml5 的加强版，那么我就来讲一下 wysiwyg 的用法，wysihtml5类似。

使用步骤
1、引入以下的js和css文件。在此我想声明一下：官网讲的只是一个大致的使用，而以下的文件必须要引入才会生效，所以本站是注重实际运用的，这些细节是不能忽略的。

2、加入一段js代码，由于代码过多，在这里就不列出来了，本站已经将源码予以整理，请参照 demo.html 的源代码
.........
3、在body标签中加入以下格式的html代码，在此需要注意的是，该编辑器并未封装，而是直接把代码写在了html页面中。整个编辑器可以分为两部分，顶部工具栏和文本编辑框。

1）顶部工具栏：是一个包含多个 div.btn-group 的 div.btn-toolbar。每一个工具按钮即是一个 div.btn-group 。在每个 div.btn-group 中我们可以自己配置提示文字而让其显示中文。

<div class="btn-toolbar" data-role="editor-toolbar" data-target="#editor"> 
  <div class="btn-group">
  </div>
..........
  <div class="btn-group">
  </div>
</div>

在这里还有一个 html5 的语音输入工具。代码如下：

2）内容文本框：div#editor

<div id="editor">
  内容
</div>

上面就是对bootstrap-wysiwyg的简单介绍，看看效果吧

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

如果大家还想深入学习，可以点击这里进行学习，再为大家附一个精彩的专题：Bootstrap学习教程

其实wysiwg搭建可视化编辑器只需要定义一些div，而编辑部分只需要一个id为editor的div即可搞定，希望这篇简短的bootstrap-wysiwyg可视化编辑器介绍，真正的帮助到大家。

bootstrap,wysiwyg,编辑器

标签：

bootstrap,wysiwyg,编辑器

免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com

评论“极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg”

极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg

暂无“极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg”评论...

《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒经典版》的玩家都可以获得奖励。

更新动态

20240901

极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg

bootstrap,wysiwyg,编辑器

bootstrap-wysiwyg结合ajax实现图片上传实时刷新功能

所见即所得的富文本编辑器bootstrap-wysiwyg使用方法详解

评论“极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg”

《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线

更新动态

友情链接