Hallo.js基于jQuery UI所见即所得的Web编辑器(jquery html函数)

编辑：rootadmin

推荐整理分享Hallo.js基于jQuery UI所见即所得的Web编辑器(jquery html函数)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:js hello world,jquery has(),javascript hello,jquery html函数,jquery.handleerror,jquery html函数,jquery html函数,jquery hello world,内容如对您有帮助，希望把文章链接给更多的朋友！

先看看效果：

Hallo.js是一个简单的富文本Web编辑器，基于jQuery UI并且利用HTML5的contentEditable实现所见即所得。其目标并不是取代当今非常流行的编辑器，如 TinyMCE 或 Aloha Editor，而是给开发者提供一种更简单、更愉快的用户编辑体验。

Hallo.js是由Henri Bergius为IKS项目开发的一款免费软件，使用CoffeeScript开发，遵循MIT许可协议，托管在GitHub上。

使用方法

1、你需要将jQuery、jQuery UI和Rangy库引入到你的项目中：

编辑器工具栏使用jQuery UI的主题，因此你可能还想自定义一个主题，适合你的需要。工具栏图标字体基于Font Awesome。风格的工具栏出现在演示中，你也会想添加一些CSS（如背景和边框）的类hallotoolbar。

引入Hallo.js

Hallo.js基于jQuery UI所见即所得的Web编辑器(jquery html函数)

调用插件是非常简单的

你也可以关闭标签的编辑功能

Hallo自己只能使选择的DOM元素可编辑和不提供任何格式的工具。格式是通过加载插件初始化Hallo。即使简单的事情，如粗体和斜体的插件：

这个例子可以使简单的格式的插件，提供如粗体和斜体的功能。你可以有很多好的插件为你想，如果有必要通过他们的选择。

Hallo有更多的选项设置当实例化。请参阅文档hallo.coffee文件。

事件方法

Hallo有一些事件，有助于整合和调用。你可以使用jQuery bind订阅它们：

halloenabled: Triggered when an editable is enabled (editable set to true) hallodisabled: Triggered when an editable is disabled (editable set to false) hallomodified: Triggered whenever user has changed the contents being edited. Event data key content contains the HTML halloactivated: Triggered when user activates an editable area (usually by clicking it) hallodeactivated: Triggered when user deactivates an editable area

插件

halloformat ? Adds Bold, Italic, StrikeThrough and Underline support to the toolbar. (Enable/Disable with options: “formattings”: {“bold”: true, “italic”: true, “strikethrough”: true, “underline”: false}) halloheadings ? Adds support for H1, H2, H3. You can pass a headings option key to specify what is going to be displayed (e.g. “formatBlocks”:[“p”, “h2″,”h3”]) hallojustify ? Adds align left, center, right support hallolists ? Adds support for ordered and unordered lists (Pick with options: “lists”: {“ordered”: false, “unordered”: true}) halloreundo ? Adds support for undo and redo hallolink ? Adds support to add links to a selection (currently not working) halloimage ? Image uploading, searching, suggestions halloblacklist ? Filtering unwanted tags from the content

编写一个插件

Hallo插件编写正则jQuery UI插件。

当Hallo加载也加载单元所有启用的插件，并通过他们一些额外的选项：

editable: The main Hallo widget instance uuid: unique identifier of the Hallo instance, can be used for element IDs

一个简单的插件看起来像以下的：

标签: jquery html函数

本文链接地址:https://www.jiuchutong.com/biancheng/381925.html 转载请保留说明！

上一篇：jQuery Validation Plugin验证插件手动验证

下一篇：jQuery form插件的使用之处理server返回的JSON， XML，HTML数据(jquery formatter)