ueditor编辑器无法提交数据解决方法
在项目开发中遇到了一个问题,后台文章详情使用的编辑器是百度的ueditor,有的电脑创建文章内容提交可以保存到数据库,有的电脑没办法保存到数据库。于是追查原因,发现提交的post请求中没有携带文章详情内容。以下是有问题的源代码:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
</head>
<body>
<form method="post" enctype="multipart/form-data" action="">
<script id="ueditor" type="text/plain" name="textinfo" style="width:900px;height:450px;"></script>
<input type="submit" value="提 交" class="tjbtn" />
</form>
<script type="text/javascript" charset="utf-8" src="u8editor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="u8editor/ueditor.all.min.js"></script>
<script type="text/javascript" charset="utf-8" src="u8editor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" charset="utf-8">
var ue = UE.getEditor('ueditor');
</script>
</body>
</html>点击提交在POST请求中没有textinfo内容。使用了很多方法都没办法解决。最终使用下面的代码解决问题。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
</head>
<body>
<form method="post" enctype="multipart/form-data" action="">
<script id="ueditor" type="text/plain" name="textinfo" style="width:900px;height:450px;"></script>
<input type="button" value="提 交" class="tjbtn" id="submitButton" />
</form>
<script type="text/javascript" charset="utf-8" src="u8editor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="u8editor/ueditor.all.min.js"></script>
<script type="text/javascript" charset="utf-8" src="u8editor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" charset="utf-8">
var ue = UE.getEditor('ueditor');
document.getElementById('submitButton').addEventListener('click', function () {
var editorContent = ue.getContent();
var hiddenTextarea = document.createElement('textarea');
hiddenTextarea.name = 'textinfo';
hiddenTextarea.style.display = 'none';
hiddenTextarea.value = editorContent;
document.querySelector('form').appendChild(hiddenTextarea);
document.querySelector('form').submit();
});
</script>
</body>
</html>相当于点击提交按钮,对提交的数据做了重新的处理,然后再去提交的,这样后台就可以收到textinfo的内容,并存入数据库了。