LineControl Editor是一款基于Bootstrap的响应式、所见即所得的富文本编辑器jQuery插件。该富文本编辑器可以使用textarea元素或任何一个容器元素来生成,它拥有常见富文本编辑器的所有功能,使用快捷方便。
插件依赖
该富文本编辑器插件依赖于jQuery2.1.0和Twitter Bootstrap以及 Font-Awesome 字体图标
Jquery (2.1.0)
Twitter Bootstrap (3.1.1)
Font-Awesome (4.0.3)
使用方法
使用该富文本编辑器要在页面中引入jQuery,bootstrap和font-awesome字体图标样式文件,以及editor.css和editor.js文件。
HTML结构
可以使用一个
来作为该富文本编辑器的容器。
初始化插件
在页面加载完毕之后可以通过下面的方法来初始化该富文本编辑器。
$(document).ready( function() {
$("#txtEditor").Editor();
});
配置参数
你可以在初始化插件的时候添加一些配置参数。
editor('createMenuItem',
{"text": "TouchGlasses", //Text replaces icon if its not available
"icon":"fa fa-glass", //This is a Font-Awesome Icon
"tooltip": "Touch Glasses",
"custom": function(button, parameters){
//Your Custom Function.
alert("Cheers!!!");
},
"params": {'option1':"value1"} //Any custom parameters you want to pass
//to your custom function.
});
下面是该文本编辑器的默认配置:
'texteffects':true,
'aligneffects':true,
'textformats':true,
'fonteffects':true,
'actions' : true,
'insertoptions' : true,
'extraeffects' : true,
'advancedoptions' : true,
'screeneffects':true,
'bold': true,
'italics': true,
'underline':true,
'ol':true,
'ul':true,
'undo':true,
'redo':true,
'l_align':true,
'r_align':true,
'c_align':true,
'justify':true,
'insert_link':true,
'unlink':true,
'insert_img':true,
'hr_line':true,
'block_quote':true,
'source':true,
'strikeout':true,
'indent':true,
'outdent':true,
'fonts':fonts,
'styles':styles,
'print':true,
'rm_format':true,
'status_bar':true,
'font_size':fontsizes,
'color':colors,
'splchars':specialchars,
'insert_table':true,
'select_all':true,
'togglescreen':true