久久久久久久999_99精品久久精品一区二区爱城_成人欧美一区二区三区在线播放_国产精品日本一区二区不卡视频_国产午夜视频_欧美精品在线观看免费

標題: 百度富文本編輯器上傳HTML到數據庫 [打印本頁]

作者: hongniu 時間: 2015-6-25 15:32
標題: 百度富文本編輯器上傳HTML到數據庫
一般展示型網站或是個人博客之類的網站為了讓發表的文章有個性，都需要嵌入HTML、CSS等。這樣就需要使用到web富文本編輯器。剛才用百度UMeditor，效果不錯。使用上也比較簡單。

下載地址：http://ueditor.baidu.com/website/index.html

1、參考Demo就可以實習顯示一個富文本編輯器，但是有一個地方被坑了。寫出來長點記性。當你自己給富文本編輯器源碼加上自己的文件夾后需要修改一個editor_api.js中的一句話（比如你喜歡把所有的JS放在一個Scripts文件夾下）。baseURL = '../Scripts/BaiduUMeditor/_src/'; 這里的baseURL需要換成你的文件夾路徑，否則在實例化啊UM的時候會找不到。

2、同樣是使用Ajax傳給ashx后臺并由他處理保存到數據庫。默認的情況下后臺接受到HTML代碼會拋出一個“危險代碼”的異常。只需要修改一下web.config配置文件取消驗證就可以了
      <httpRuntime targetFramework="4.5" requestValidationMode="2.0"/>
      <pages validateRequest="false"></pages>

3、代碼：
      <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="SaveHTML.WebForm1" %>

      <!DOCTYPE html>

      <html xmlns="http://www.w3.org/1999/xhtml">
      <head runat="server">
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>百度富文本編輯器</title>
      <link href="Scripts/BaiduUMeditor/themes/default/_css/umeditor.css" type="text/css" rel="stylesheet" />
      <script type="text/javascript" src="http://c.51hei.com/a/a/b/562571327708.jpg"></script>
      <script type="text/javascript" charset="utf-8" src="http://c.51hei.com/a/a/b/5625713243534.jpg"></script>
      <script type="text/javascript" charset="utf-8" src="http://c.51hei.com/a/a/b/562571321697.jpg"></script>
      <script type="text/javascript" src="http://c.51hei.com/a/a/b/5625713222901.jpg"></script>
      <script type="text/javascript">
         $(document).ready(function () {
            //實例化編輯器
            var um = UM.getEditor('myEditor');
         });

         //按鈕的操作
         function getContent() {
            var arr = [];
            arr.push(UM.getEditor('myEditor').getContent());
            //alert(arr.join("\n"));

            $.ajax({
                  url: "SaveHTMLHandler.ashx",
                  type: "POST",
                  data: { strHTML: arr.join("\n") },
                  success: function (data) {
                     alert(data);
                  },
                  error: function () {
                     alert("提示：連接服務器出現異常！");
                  }
            });
         }
      </script>
</head>
<body>
      <h1>UMEDITOR 完整demo</h1>
      <div id="btns">
         <table>
            <tr>
                  <td>
                     <button >發表</button> 
                  </td>
            </tr>
         </table>
      </div>
      
      <script type="text/plain" id="myEditor" style="width: 1000px; height: 240px;">
      </script>
      <div>
         <h3 id="focush2"></h3>
      </div>
</body>
</html>

歡迎光臨 (http://www.zg4o1577.cn/bbs/)

<rt id="0wmem"></rt>