summernote图片上传和替代不工作

我在我的网站上使用summernote编辑器,并使用他们网站上提到的Click2edit方法实现了它。

但是,如果按原样使用图像上载会导致各种问题。 我的理解是这是使用一种叫做base64的东西。 我尝试使用另一个stackoverflow答案[here]中的代码将更直接的文件上传到服务器。 ( Summernote图片上传 )然而它似乎没有做任何事情,图像仍然插入原始方法。 如果你能帮我解决如何正确实现这个问题。

在错误方面,我的网站有几个标签,其中一个标签包含click2edit summernote编辑器,当我尝试使用图片上传并保存时,图片不显示,它将标签组合为1页(可能一些特殊的角色在哪里引起问题?)。 其次,作为文本数据类型的sql列在sql management studio中查看时没有显示内容且内容可编辑,给出了某种保存错误。 我最终需要将所有条目一起删除才能恢复正常。

我的代码:

实施夏令营:

click2edit
var edit = function() { $('.click2edit').summernote({focus: true}); }; var save = function() { var aHTML = $('.click2edit').code(); //save HTML If you need(aHTML: array). $('.click2edit').destroy(); };

我正在使用的文件上传:

 $(document).ready(function() { $('#summernote').summernote({ height: 200, onImageUpload: function(files, editor, welEditable) { sendFile(files[0], editor, welEditable); } }); function sendFile(file, editor, welEditable) { data = new FormData(); data.append("file", file); $.ajax({ data: data, type: "POST", url: "form_summernote_doc_upload_post.php", cache: false, contentType: false, processData: false, success: function(url) { editor.insertImage(welEditable, url); } }); } }); 

我还应该提一下输出是否正在使用包含的Post上传到sql

 (stuff)....sql_safe($Postarray[text])....(stuff) 

我认为这可能与我使用click2edit方法启动summernote而不是给它一个直接#summernote id的事实有关。 但我也尝试了,结果是一样的。 我也不明白如何禁用summernotes自己的上传方法,也许这就是重写。 谢谢

Summer note新版本只传递一个参数。 所以你可以使用这个脚本

 $('.summer').summernote({ height: "200px", callbacks: { onImageUpload: function(files) { url = $(this).data('upload'); //path is defined as data attribute for textarea sendFile(files[0], url, $(this)); } } }); function sendFile(file, url, editor) { var data = new FormData(); data.append("file", file); $.ajax({ data: data, type: "POST", url: url, cache: false, contentType: false, processData: false, success: function(objFile) { editor.summernote('insertImage', objFile.folder+objFile.file); }, error: function(jqXHR, textStatus, errorThrown) { } }); } 

我在编辑器上做了一些小改动,

原始summernote将上传的图像转换为base64格式。 此编辑器通过Php将图像上传到文件系统,只需确保您具有img-uploads文件夹的写入权限。

https://github.com/pherdee/summernote-img-upload

我意识到我正在制造的这个愚蠢的错误

 onImageUpload: function(files, editor, welEditable) { sendFile(files[0], editor, welEditable); } 

需要包含在summernote初始化函数中,如下所示:

 var editit = function() { $("#defaulttab").addClass("active"); $('.click2edit').summernote({ focus: true, onImageUpload: function(files, editor, welEditable) { sendFile(files[0], editor, welEditable); }