在实现新闻管理时用到了百度的UEditor编辑器,之前也用过,阅读文档然后操作是没出现任何问题的(使用form表单提交)。现在是想用js获取UEditor内容然后用ajax实现异步提交,死活都get不到UEditor的内容。网上查找资料都说使用editor.getContent()方法获取文本内容。还是获取不到。弄了很久还是没有解决,问题放一边,第二天再看的时候突然就有思路了。
页面样式:
这是我本地html代码:
<form class="layui-form"> <div class="layui-form-item"> <label class="layui-form-label">标题:</label> <div class="layui-input-block"> <input type="text" name="title" placeholder="请输入新闻标题" class="layui-input" value="" id="title"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">内容:</label> <div class="layui-input-block"> <textarea name="content" id="content" style="min-height: 200px; width: 668px;"></textarea> </div> </div> </form>
这里是查看浏览器控制台的html代码:
这个时候就发现了,我们填写的内容都在iframe里面,是不能直接获取的。参照表单提交的方式,表单提交的时候是提交name="content"的值。所以这里我们直接获取name="content"文本的值就ok了。
function add() { layer.open({ type : 2, title : '新增页面', skin : 'layui-layer-molv', shadeClose : false, shade : 0.8, area : [ '800px', '550px' ], id : (new Date()).valueOf(), // 设定一个id,防止重复弹出 时间戳 content : "news/forwardEditNews",// 跳转的页面 btn : [ '添加', '取消' ], yes : function(index, layero) { var body = layer.getChildFrame('body', index); $.post("news/addNews", { title : body.find('#title').val(), //这里就是获取富文本的内容 content : body.find('textarea[name="content"]').val() }, function(data) { if (data.success) { layer.msg(data.msg, { offset : '100px', icon : 1, time : 1500 }, function() { //刷新列表 $(".layui-laypage-btn").click(); }); } else { layer.msg(data.msg, { offset : '100px', icon : 1 }); } }); layer.close(index); }, btn2 : function(index) { layer.close(index); } }); }
我这里用的是layui前端框架 ,js获取:$('textarea[name="content"]').val();