網頁開發中文本編輯器UEditor的使用

時間 2019-11-18

原文原文鏈接

首先看一下效果圖：javascript

首先咱們須要來認識下UEditor，它是由百度web前端研發部開發所見即所得富文本web編輯器，而且是基於BSD協議的開源產品，容許自由使用和修改，開源就意味着能夠本身來定製這個編輯器。html

實現方法：前端

首先先下載UEditer,官方網址：http://ueditor.baidu.com/website/，根據本身需求下載相應的版本（其實裏面都有demo實現調用編輯器）java

下面就是一個簡單的調用實例，只須要引入ueditor.config.js，ueditor.all.min.js，lang/zh-cn/zh-cn.js這三個文件便可，還須要其餘功能的能夠繼續去挖掘web

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" charset="utf-8" src="UEditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="UEditor/ueditor.all.min.js"> </script>
<!--建議手動加在語言，避免在ie下有時由於加載語言失敗致使編輯器加載失敗-->
<!--這裏加載的語言文件會覆蓋你在配置項目裏添加的語言類型，好比你在配置項目裏配置的是英文，這裏加載的中文，那最後就是中文-->
<script type="text/javascript" charset="utf-8" src="UEditor/lang/zh-cn/zh-cn.js"></script>
</head>
<body>
    <script id="container" name="content" type="text/plain">這裏就是編輯器的正文</script>
    <!-- 實例化編輯器 -->
    <script type="text/javascript">
            var ue = UE.getEditor('container');
    </script>
</body>
</html>