UmEditor 文本编辑器常规用法

首先需在 网页头部引用 CSS 和 js
如:

<link href="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/themes/default/css/umeditor.css"
        rel="stylesheet" type="text/css" />
在引入 jq 
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/third-party/jquery.min.js"
        type="text/javascript"></script>
 引入 umeditor 的相关脚本
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/umeditor.config.js" type="text/javascript"></script>
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/umeditor.min.js" type="text/javascript"></script>
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/lang/zh-cn/zh-cn.js" type="text/javascript"></script>
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/dialogs/emotion/emotion.js"
        type="text/javascript"></script>
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/dialogs/image/image.js"
        type="text/javascript"></script>
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/dialogs/formula/formula.js"
        type="text/javascript"></script>
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/dialogs/link/link.js"
        type="text/javascript"></script>
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/dialogs/map/map.js" type="text/javascript"></script>
<script src="umeditor1_2_2-utf8-net/umeditor1_2_2-utf8-net/dialogs/video/video.js"
        type="text/javascript"></script>
在 网页的 body 部分引入
<script type="text/plain" id="myEditor" style="width:1000px;height:240px;">
    
</script>

//实例化编辑器

 <script type="text/javascript">
         var um = UM.getEditor('myEditor');
         um.addListener('blur', function () {
             $('#focush2').html('编辑器失去焦点了')
         });
         um.addListener('focus', function () {
             $('#focush2').html('')
         });
     </script>

在后台获取 文本信息
//editorValue 为 umEditor 的name值
string newsContent = Request[“editorValue”];

//对umEditor 操作的相关方法

//获得文本框的值 方法
function getContent() {
var arr = [];
arr.push(“使用editor.getContent()方法可以获得编辑器的内容”);
arr.push(“内容为:”);
arr.push(UM.getEditor(‘myEditor’).getContent());
alert(arr.join("\n"));
}
//写入文本框的值
function setContent(isAppendTo) {
var arr = [];
arr.push(“使用editor.setContent(‘欢迎使用umeditor’)方法可以设置编辑器的内容”);
//主要是下面这句代码
UM.getEditor(‘myEditor’).setContent(‘欢迎使用umeditor’, isAppendTo);
alert(arr.join("\n"));
}
//追加内容
function setContent(isAppendTo) {
var arr = [];
arr.push(“使用editor.setContent(‘欢迎使用umeditor’)方法可以设置编辑器的内容”);
UM.getEditor(‘myEditor’).setContent(‘欢迎使用umeditor’, isAppendTo);
alert(arr.join("\n"));
}
//或得纯文本
function getContentTxt() {
var arr = [];
arr.push(“使用editor.getContentTxt()方法可以获得编辑器的纯文本内容”);
arr.push(“编辑器的纯文本内容为:”);
arr.push(UM.getEditor(‘myEditor’).getContentTxt());
alert(arr.join("\n"));
}
//获得带格式的纯文本
function getPlainTxt() {
var arr = [];
arr.push(“使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容”);
arr.push(“内容为:”);
arr.push(UM.getEditor(‘myEditor’).getPlainTxt());
alert(arr.join(’\n’))
}
//判断是否有内容
function hasContent() {
var arr = [];
arr.push(“使用editor.hasContents()方法判断编辑器里是否有内容”);
arr.push(“判断结果为:”);
arr.push(UM.getEditor(‘myEditor’).hasContents());
alert(arr.join("\n"));
}
//编辑器获得焦点
function setFocus() {
UM.getEditor(‘myEditor’).focus();
}
// 编辑器是否获得焦点
function isFocus(){
alert(um.isFocus())
}
//编辑器取消焦点
function doBlur(){
um.blur()
}
//插入给定的内容
function insertHtml() {
var value = prompt(‘插入html代码’, ‘’);
um.execCommand(‘insertHtml’, value)
}
//可以编辑
function setEnabled() {
UM.getEditor(‘myEditor’).setEnabled();
enableBtn();
}
//不可以编辑
function setDisabled() {
UM.getEditor(‘myEditor’).setDisabled(‘fullscreen’);
disableBtn(“enable”);
}
//其余方法
UM.getEditor(‘myEditor’).setHide()隐藏编辑器
UM.getEditor(‘myEditor’).setShow()显示编辑器
UM.getEditor(‘myEditor’).setHeight(300)设置编辑器的高度为300
UM.getEditor(‘myEditor’).setWidth(1200)设置编辑器的宽度为1200

使用此插件重要是需要文件头部设置中添加相关设置否则会报错

 <%@ Page Language="C#" AutoEventWireup="true" ValidateRequest="false" CodeBehind="BookInfoAdd.aspx.cs" Inherits="Maticsoft.Web.Admin.BookInfoAdd"  %>

ValidateRequest=“false” 主要是这句 或者在web.config的配置文件中 设置

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值