在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
去官网下载,本Demo用的MVC模式 下载地址:http://ueditor.baidu.com/website/download.html 加入文件夹中的结构: 引入了函数公式的图标: @{ ViewBag.Title = "Index"; } @*配置文件*@ <script src="~/Scripts/ueditor/ueditor.config.js"></script> <script src="~/Scripts/ueditor/ueditor.all.min.js"></script> <link href="~/Scripts/ueditor/themes/iframe.css" rel="stylesheet" /> <script src="~/Scripts/ueditor/lang/zh-cn/zh-cn.js"></script> @*函数公式插件引入的js*@ <script type="text/javascript" charset="utf-8" src="~/Scripts/ueditor/kityformula-plugin/addKityFormulaDialog.js"></script> <script type="text/javascript" charset="utf-8" src="~/Scripts/ueditor/kityformula-plugin/getKfContent.js"></script> <script type="text/javascript" charset="utf-8" src="~/Scripts/ueditor/kityformula-plugin/defaultFilterFix.js"></script> @{ ViewBag.Title = "UEditorDemo"; } <script type="text/javascript"> var editor = new baidu.editor.ui.Editor({ UEDITOR_HOME_URL: '/Scripts/ueditor/',//配置编辑器路径 iframeCssUrl: '/Scripts/ueditor/themes/iframe.css',//样式路径 initialContent: '',//初始化编辑器内容 autoHeightEnabled: true,//高度自动增长 minFrameHeight: 500,//最小高度 autoFloatEnabled: true, initialFrameWidth: 784, initialFrameHeight: 400 }); editor.render('editor'); </script> </div> @using (Html.BeginForm("Index", "UEditor", FormMethod.Post)) { <div> </div> <div>内容</div> <div> <textarea ></textarea></div> <input type="submit" value="提交" /> } <div> <!--转化图片格式的--> <button onclick="ReplaceImage()">imagebase64替换为image</button> <button onclick="getAllHtml()">获得整个html的内容</button> <button onclick="getContent()">获得内容</button> <button onclick="setContent()">写入内容</button> <button onclick="setContent(true)">追加内容</button> <button onclick="getContentTxt()">获得纯文本</button> <button onclick="getPlainTxt()">获得带格式的纯文本</button> <button onclick="hasContent()">判断是否有内容</button> <button onclick="setFocus()">使编辑器获得焦点</button> <button onmousedown="isFocus(event)">编辑器是否获得焦点</button> <button onmousedown="setblur(event)">编辑器失去焦点</button> </div> <div> <button onclick="getText()">获得当前选中的文本</button> <button onclick="insertHtml()">插入给定的内容</button> <button >可以编辑</button> <button onclick="setDisabled()">不可编辑</button> <button onclick=" UE.getEditor('editor').setHide()">隐藏编辑器</button> <button onclick=" UE.getEditor('editor').setShow()">显示编辑器</button> <button onclick=" UE.getEditor('editor').setHeight(300)">设置高度为300默认关闭了自动长高</button> </div> <div> <button onclick="getLocalData()">获取草稿箱内容</button> <button onclick="clearLocalData()">清空草稿箱</button> </div> <div> <button onclick="createEditor()"> 创建编辑器 </button> <button onclick="deleteEditor()"> 删除编辑器 </button> </div> <script type="text/javascript"> //实例化编辑器 //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例 var ue = UE.getEditor('editor'); //将image的src从base64替换为文件名 function ReplaceImage() { ue.getKfContent(function (content) { }); } function isFocus(e) { alert(UE.getEditor('editor').isFocus()); UE.dom.domUtils.preventDefault(e) } function setblur(e) { UE.getEditor('editor').blur(); UE.dom.domUtils.preventDefault(e) } function insertHtml() { var value = prompt('插入html代码', ''); UE.getEditor('editor').execCommand('insertHtml', value) } function createEditor() { enableBtn(); UE.getEditor('editor'); } function getAllHtml() { alert(UE.getEditor('editor').getAllHtml()) } function getContent() { var arr = []; arr.push("使用editor.getContent()方法可以获得编辑器的内容"); arr.push("内容为:"); arr.push(UE.getEditor('editor').getContent()); alert(arr.join("\n")); } function getPlainTxt() { var arr = []; arr.push("使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容"); arr.push("内容为:"); arr.push(UE.getEditor('editor').getPlainTxt()); alert(arr.join('\n')) } function setContent(isAppendTo) { var arr = []; arr.push("使用editor.setContent('欢迎使用ueditor')方法可以设置编辑器的内容"); UE.getEditor('editor').setContent('欢迎使用ueditor', isAppendTo); alert(arr.join("\n")); } function setDisabled() { UE.getEditor('editor').setDisabled('fullscreen'); disableBtn("enable"); } function setEnabled() { UE.getEditor('editor').setEnabled(); enableBtn(); } function getText() { //当你点击按钮时编辑区域已经失去了焦点,如果直接用getText将不会得到内容,所以要在选回来,然后取得内容 var range = UE.getEditor('editor').selection.getRange(); range.select(); var txt = UE.getEditor('editor').selection.getText(); alert(txt) } function getContentTxt() { var arr = []; arr.push("使用editor.getContentTxt()方法可以获得编辑器的纯文本内容"); arr.push("编辑器的纯文本内容为:"); arr.push(UE.getEditor('editor').getContentTxt()); alert(arr.join("\n")); } function hasContent() { var arr = []; arr.push("使用editor.hasContents()方法判断编辑器里是否有内容"); arr.push("判断结果为:"); arr.push(UE.getEditor('editor').hasContents()); alert(arr.join("\n")); } function setFocus() { UE.getEditor('editor').focus(); } function deleteEditor() { disableBtn(); UE.getEditor('editor').destroy(); } function disableBtn(str) { var div = document.getElementById('btns'); var btns = UE.dom.domUtils.getElementsByTagName(div, "button"); for (var i = 0, btn; btn = btns[i++];) { if (btn.id == str) { UE.dom.domUtils.removeAttributes(btn, ["disabled"]); } else { btn.setAttribute("disabled", "true"); } } } function enableBtn() { var div = document.getElementById('btns'); var btns = UE.dom.domUtils.getElementsByTagName(div, "button"); for (var i = 0, btn; btn = btns[i++];) { UE.dom.domUtils.removeAttributes(btn, ["disabled"]); } } function getLocalData() { alert(UE.getEditor('editor').execCommand("getlocaldata")); } function clearLocalData() { UE.getEditor('editor').execCommand("clearlocaldata"); alert("已清空草稿箱") } </script>
想把内容保存进去,但是有HTML标签,正则处理的代码: public static string CleanHtml(string strHtml) { if (string.IsNullOrEmpty(strHtml)) return strHtml; //删除脚本 //strHtml = Regex.Replace(strHtml, "(+'\'+<script(.+?)+'\'+</script+'\'+>)|(+'\'+<style(.+?)+'\'+</style+'\'+>)", "", RegexOptions.IgnoreCase | RegexOptions.Singleline); strHtml = Regex.Replace(strHtml, @"<script[^>]*?>.*?</script>", "", RegexOptions.IgnoreCase); //删除标签 var r = new Regex(@"</?[^>]*>", RegexOptions.IgnoreCase); Match m; for (m = r.Match(strHtml); m.Success; m = m.NextMatch()) { strHtml = strHtml.Replace(m.Groups[0].ToString(), ""); } return strHtml.Trim(); }
|
请发表评论