百度編輯器具有豐富文本編輯功能,且開源免費,其使用方法如下: 1.在官網上下載對應的Uditor壓縮包:http://ueditor.baidu.com/website/download.html 2.在項目根目錄下創建ueditor文件夾 ,並將下載的UEditor解壓後的文件放在ueditor文 ...
百度編輯器具有豐富文本編輯功能,且開源免費,其使用方法如下:
1.在官網上下載對應的Uditor壓縮包:http://ueditor.baidu.com/website/download.html
2.在項目根目錄下創建ueditor文件夾 ,並將下載的UEditor解壓後的文件放在ueditor文件下下
3.在ueditor文件夾下找到ueditor.config.js文件,並修改編輯器實例的路徑
4. 在Web.Config配置文件的System.web節點下加上:<httpRuntime targetFramework="4.5" requestValidationMode="2.0"/>,該設置可使客戶端的校驗無效
5.新建一個頁面,頁面內容如下:
<body>
<form id="form1" runat="server">
<textarea id="myEditor" name="myEditor" runat="server" onblur="setUeditor()"></textarea>
<script type="text/javascript">
var editor = new baidu.editor.ui.Editor();
editor.render("myEditor");
</script>
<div id="myButton" runat="server">
<asp:Button ID="Button" runat="server" Text="獲取數據" />
</div>
</form>
<script type="text/javascript">
function setUeditor() {
var myEditor = document.getElementById("myEditor");
myEditor.value = editor.getContent();
}
</script>
</body>
到了這一步,在瀏覽器中查看你的頁面,編輯器便正常顯示出來了:
6.備註:有的朋友可能在上傳圖片,視頻,附件等內容時可能無法上傳,原因是路徑的配置,解決方法:ueditor/net/目錄下新建upload文件夾,併在該文件夾下新建image,video等文件夾即可,文件夾創建的目錄也可以在ueditor/net/config.json文件中進行配置,截圖如下: