html的body中:

<script id="editor" type="text/plain" ></script>

js中:

//实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
    var ue = UE.getEditor('editor',{
                //initialFrameWidth :980,//设置编辑器宽度
                initialFrameHeight:500,//设置编辑器高度
                scaleEnabled:true
            });

后台取出原本文章内容放入编辑器(ajax回调函数中):

var content = data.body;
            //判断ueditor 编辑器是否创建成功
            ue.addListener("ready", function () {
                // editor准备好之后才可以使用
                ue.setContent(content);
            });

例子:

html代码:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>oneUser</title>
<link href="/css/blog_style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/datepattern.js"></script>
<script type="text/javascript" src="/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="/ueditor/ueditor.all.js"></script>
<script type="text/javascript" src="/ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" src="/js/commons_head_foot.js"></script>
<script type="text/javascript" src="/js/modifyBlog.js"></script>
</head>
<body>
<div>
<div id="commons_head"></div> <div class="navigation">
<span>标题:</span>
<input id="essay_title" type="text" style="font-size:18px;font-weight:bold;"/>
<br>
<br>
评论:<span id="evaluateCount"></span>
点赞:<span id="admireCount"></span><br>
<span id="createTime"></span>
</div>
<div class="center_body" style="margin-top:5px;">
<script id="editor" type="text/plain" ></script>
<input type="button" id="modifyContent" value="提交修改" style="float:right;"/>
</div> <div id="commons_foot"></div>
</div>
</body>
</html>

js代码:

$(function(){
//实例化编辑器
//建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
var ue = UE.getEditor('editor',{
//initialFrameWidth :980,//设置编辑器宽度
initialFrameHeight:500,//设置编辑器高度
scaleEnabled:true
}); var ur = window.location.search;
var essayId = ur.substring(9,ur.length);
$.ajax({
url:"/frame/myEssayDetails/"+essayId,
type:"get",
contentType:"application/json;charset=utf-8",
dataType:"json",
success:function(data){
$("#essay_title").val(data.title);
var essayId = data.id;
$("#createTime").html(new Date(data.createTime).pattern("yyyy-MM-dd hh:mm:ss"));
$("#evaluateCount").html(data.evaluateCount);
$("#admireCount").html(data.admireCount); var content = data.body;
//判断ueditor 编辑器是否创建成功
ue.addListener("ready", function () {
// editor准备好之后才可以使用
ue.setContent(content);
});
},
error:function(){
alert("error");
}
}); $("#modifyContent").click(function(){
var allHtml = UE.getEditor('editor').getContent();
var title = $("#essay_title").val().trim();
$.ajax({
url:"/frame/essay",
type:"post",
contentType:"application/json;charset=utf-8",
data:JSON.stringify({
"id":essayId,
"title":title,
"body":allHtml
}),
dataType:"json",
success:function(data){
if (data.success==true) {
var url = "/index.html";
window.location.href=url;
} else {
alert(data.message);
}
},
error:function(){
alert("出错了");
}
});
});
});

ueditor1_4_3_3编辑器修改文章的更多相关文章

  1. 解决外部编辑器修改Eclipse文件延迟刷新【补充】

    在之前的文章,使用gulp解决外部编辑器修改Eclipse文件延迟刷新,原理是用gulp把更改过的项目文件直接复制一份到Tomcat的webapp.root下, 现在补充另外一种方法,双击Server ...

  2. BBS后台发送邮件&修改文章

    一:Django发送邮件 在setting中配置 # EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend' EMAIL_HOST ...

  3. Laravel大型项目系列教程(四)显示文章列表和用户修改文章

    小编心语:不知不觉已经第四部分了,非常感谢很多人给小编提的意见,改了很多bug,希望以后能继续帮小编找找茬~小编也不希望误导大家~这一节,主要讲的 是如何显示文章列表和让用户修改文章,小编预告一下(一 ...

  4. 使用gulp解决外部编辑器修改Eclipse文件延迟更新的问题

    本人前端用惯了Hbuilder,修改了eclipse项目中的文件后,由于是外部编辑器修改过的,eclipse不会自动部署更新,一般按F5刷新项目,或者在 preferences > genera ...

  5. dedeCMS修改文章更新发布时间问题

    今天在dedeCMS系统中,修改或文章时发现,只要提交以后,文章发布时间便是当前时间.但有时候修改文章以后并不想把文章发布时间也更新成修改时间.我希望的是,修改文章不对时间做更改保持文章原有发布时间, ...

  6. WordPress批量修改文章内容、URL链接、文章摘要

    通过SQL语句来批量修改wordpress博客内容,文章中所有语句都使用默认的wp_表前缀,如果您的数据表前缀不是wp_则需要在语句中作相应更改. 方法/步骤   批量修改文章内容 如果您想替换之前写 ...

  7. Django学习(八)---修改文章和添加文章

    博客页面的修改文章和添加新文章 从主页点击不同文章的超链接进入文章页面,就是传递了一个id作为参数,然后后台代码根据这个参数从数据库中取出来对应的文章,并把它传递到前端页面 修改文章和添加新文章,是要 ...

  8. dedecms批量修改文章为待审核稿件怎么操作

    dedecms批量修改文章为待审核稿件要怎么操作呢?因为我们有时会出于某些原因要把文章暂时先隐藏掉,dedecms有一个比较好的功能是将文件状态设为未审核前台就可以看不到了,那要怎么批量设置呢?到后台 ...

  9. Vi编辑器修改文件.bash_profile可解决backspace出现乱码问题,rlwrap 的安装。

    Vi编辑器修改文件.bash_profile可解决backspace出现乱码问题 使用SecureCRT或是pietty_ch连接到一台安装有Oracle DB 10g的RHEL4.2的机器,linu ...

随机推荐

  1. libgdx 1.4.1公布

    (转载自http://www.libgdx.cn/topic/4/libgdx-1-4-1%E5%8F%91%E5%B8%83) libgdx从未停止进步的脚步.10月10日.libgdx1.4.1公 ...

  2. sqlite时间戳转时间语句(时间转时间戳)实例

    sqlite时间戳转时间.时间转时间戳的方法 实现代码: sqlite, 'unixepoch', 'localtime'); +----------------------------------- ...

  3. 【Android】20.3 拍照和视频录制

    分类:C#.Android.VS2015: 创建日期:2016-03-13 一.简介 Android提供的Camera有两个典型的版本,一个是在Android 5.0以前提供的,称为Camera:另一 ...

  4. 自动实时监控Windows2003服务器终端登录

    朋友一台Windows服务器被黑了,而且还被人恶意删除了一些数据备份,帮其做了下安全加固,考虑到服务器都是通过Windows 终端服务器来管理的,就想办法对其登录做个监控,找了个命令行下发邮件的小工具 ...

  5. AC Again hdoj 1582 搜索

    AC Again Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Su ...

  6. Failed to stop Abandoned connection cleanup thread

    刚才在测试一个用户登录程序的时候,是这么一个情况,在login.jsp登录之后,跳转到success.jsp页面 然后我修改了一个servlet,重新deploy到/WEB-INF/classes下( ...

  7. Leetcode: LRU Cache 解题报告

    LRU Cache  Design and implement a data structure for Least Recently Used (LRU) cache. It should supp ...

  8. string.h中的库函数

    虽然面试的时候,都会叫你不使用c库函数,自己完成某某函数的编写,但是库函数毕竟更让人信赖,我们没有任何理由怀疑库函数而使用自己的版本.不过当做练习,自己还是可以实现一下的.这里记录一下5th c pr ...

  9. c++之——虚析构函数

    先看代码: #include<iostream> using namespace std; class Parent { public: Parent() :a(), b(), c() { ...

  10. python 实现ARP攻击

    注:使用这个脚本需要安装scapy 包 最好在linux平台下使用,因为scapy包在windows上安装老是会有各种问题 #coding:utf-8 #example :sudo python ar ...