UEditor富文本编辑器用法

1. 下载ueditor文件

引用js文件:

<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.all.js"></script>
<script type="text/javascript" charset="utf-8" src="/ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor-patch-149.js">

</title>

js判断部分
<script type="text/javascript">
　　window.onload = function() {
　　var editor = UE.getEditor('editor')
　　}
　　function checkAdd() {
　　　　var editor = UE.getEditor('editor')
　　　　　　if (editor.hasContents()) {
　　　　　　　　document.getElementById('chkForm').submit()
　　　　　　} else {
　　　　　　tusi('内容不能为空！')
　　　　}
　　}
</script>
</head>
<body>

form表单部分

<form name="form" id="chkForm" method="post" action=" ">
<tr>
<td align=left>
<script name="myContent" type="text/plain" id="editor" style="width:1024px;height:280px;">
</script>
</td>
</tr>
<tr>
<td align=left>
<input type="button" value="提交数据" onClick="checkAdd();" style="width: 120px; height: 30px;">
</td>
</tr>
</form>
</body>

</html>

自定义工具栏

修改ueditor.config.js

<script>
$(function() {
    //本来是这样的:UE.getEditor('editor');  传入参数后就是下面那样子了，toolbars里的就是工具的图标
    UE.getEditor('editor', {
          toolbars: [
               ['fullscreen', 'source', 'undo', 'redo', 'bold', 'italic', 'underline', 'fontborder', 'backcolor', 'fontsize', 'fontfamily', 'justifyleft', 'justifyright', 'justifycenter', 'justifyjustify', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', 'link', 'unlink', 'emotion', 'help']
          ]
    });
})
</script>

配置项里用竖线 ‘|’ 代表分割线

 

UEditor文档链接地址:http://fex-team.github.io/ueditor/

 

echop 富文本

{php}
$fckroot = './fckeditor/';
include($fckroot . 'fckeditor.php');
$fck = new FCKeditor('guige') ;
$fck->BasePath = $fckroot;
$fck->ToolbarSet = 'Default';
$fck->Height='280px';
$fck->Value=$this->_tpl_vars['guige'];
$fck->Create();
{/php}

posted @ 2014-06-05 10:28  流年沉默的如此苍凉╰╮  阅读(391)  评论(0)    收藏  举报