javascript - Summernote上传图片: onImageUpload and sendFile function not working-6ren

javascript - Summernote上传图片: onImageUpload and sendFile function not working

转载作者：行者123 更新时间：2023-11-28 03:22:30

25

4

我使用的是 Summernote v 0.8.12

我的 Summernote 页面:

<!DOCTYPE html>
<html lang="en"><head>
    <meta charset="UTF-8">
    <title>bootstrap4</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.js"></script>
    <script>
      $(document).ready(function() {
    $("#summernote").summernote({
      placeholder: 'enter directions here...',
            height: 300,
            callbacks: {
            onImageUpload : function(files, editor, welEditable) {

         for(var i = files.length - 1; i >= 0; i--) {
                 sendFile(files[i], this);
        }
    }
}
});
});
        function sendFile(file, el) {
    var form_data = new FormData();
    form_data.append('file', file);
    $.ajax({
        data: form_data,
        type: "POST",
        url: 'editor-upload2.php',
        cache: false,
        contentType: false,
        processData: false,
    success: function(url) {
    $(el).summernote('editor.insertImage', url);
   }
    });
    }

    </script>

  </head>
  <body>
    <form action="" method="post">
    <input name="subject" class="form-control" />
      <textarea id="summernote" name="body"></textarea>
      <input name="button" type="submit" value="Submit" id="button">
    </form>

  </body>
</html>

上传图片编辑器的php文件-upload2.php:

<?php
if ($_FILES['file']['name']) {
            if (!$_FILES['file']['error']) {
                $name = md5(rand(100, 200));
                $ext = explode('.', $_FILES['file']['name']);
                $filename = $name . '.' . $ext[1];
                $destination = 'images/' . $filename; //change this directory
                $location = $_FILES["file"]["tmp_name"];
                move_uploaded_file($location, $destination);
                echo 'https://www.mysite.co.uk/folder/emails/' . $filename;//change this URL
            }
            else
            {
              echo  $message = 'Ooops!  Your upload triggered the following error:  '.$_FILES['file']['error'];
            }
        }
?>

summernote 页面似乎没有将任何信息传递到 editor-upload2.php 文件，因为没有上传任何内容，并且 Summernote 表单文本区域中也没有出现任何内容。

如有任何帮助，我们将不胜感激。

非常感谢您阅读本文。

最佳答案

主页标题中的以下脚本阻止其工作:

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>

我从网址中去掉了“slim”，现在可以正常工作了

关于javascript - Summernote上传图片: onImageUpload and sendFile function not working，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58999839/

25

4

0

文章推荐： php - 动态更改高度时，页脚不会停留在机器人上

文章推荐： c++ - 嵌套类变量调用

文章推荐： javascript - jQuery scrollTo 并隐藏一个元素

文章推荐： javascript - 为什么需要复制数组才能对其使用方法？

function - 命名空间::function cannot be used as a function
main.cpp #include "Primes.h" #include int main(){ std::string choose; int num1, num2; w
c - 为什么调用此函数会产生错误 " is not a function or function pointer"？
似乎函数 qwertyInches() 应该可以工作但是当我在 main() 中调用它时它给了我 [Error] called object 'qwertyInches' is not a funct
c++ - object.function().function().function().......这是如何工作的？
我无法理解 C++ 语法的工作原理。 #include using namespace std; class Accumulator{ private: int value; public:
function - dart 中的 Function() 和 Function 有什么区别？
在类中声明函数成员时，我们可以同时执行这两种操作； Function first; Function() second; 它们之间有什么区别？最佳答案 Function 代表任意函数: void
jquery错误: a function is not a function?
“colonna”怎么可能是一个简单的字符串: $('td.' + colonna).css('background-color','#ffddaa'); 可以正确突出显示有趣单元格的背景，并且: $
javascript - 如何将传递到 function() 的动态参数中继到 function() 中调用的 function()
我正在尝试将网页中的动态参数中继到函数中，然后函数将它们传递给函数内部的调用。比如下面这个简化的代码片段，现在这样，直接传入参数是没有问题的。但是，如何在不为每个可能的 colorbox 参数设置 s
C++ Lambdas : function that returns a function that returns a function . ..？
C++ 中是否有一种模式允许您返回一个函数，它返回一个函数本身。例如 std::function func = ...; do { func = func(); } while (func);
c - 错误 : function declared as function returning function
我正在将 Windows 程序集移植到 Linux。我有一些代码要移植。我实际上是 linux 中 C 的新手。我知道 C 基础知识是一样的! typedef struct sReader {
javascript - 何时使用 function() 、 function 或 () => function(callback)
我一直在寻找一个很好的解释，所以我很清楚。示例: this.onDeleteHandler(index)}/> 对比对比 this.nameChangedhandler(event, perso
javascript - 为什么 function(){}.__proto__ === Function.prototype 和 Function.prototype === function(){}.__proto_ 返回不同的结果
function(){}.__proto__ === Function.prototype 和 Function.prototype === function(){}.__proto__ 得到不同的结
javascript - 'Function' 上的 MDN 描述感到困惑，Function.length 是 Function 或 Function.prototype 的属性
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function 据说 Propert
function - Excel VBA : Special Types - Functions as Arguments of Functions
VBA 中的函数没有特殊类型。我很难理解如何在 Excel VBA 中将函数作为参数添加到函数中。我想要完成的是这样的事情: function f(g as function, x as strin
r - Tidyeval in own functions in own functions inside own functions with the pipe 管道
所以我正在尝试制作一个包(我没有在下面包含我的 roxygen2 header ): 我有这个功能: date_from_text % dplyr::mutate(!!name := lubr
c++ - 从 std::function 继承构造函数时为 "function returning a function"
尝试从 std::function 派生一个类，对于初学者来说，继承构造函数。这是我的猜测: #include #include using namespace std; template cla
javascript - 错误: function is not defined when calling a function returned by another function
我正在尝试编写一个返回另一个函数的函数。我的目标是编写一个函数，它接受一个对象并返回另一个函数“search”。当我使用键调用搜索函数时，我想从第一个函数中给定的对象返回该键的值。 propertyO
functional-programming - "Functional programming"有明确的含义，但是 "functional language"吗？
我非常清楚函数式编程技术和命令式编程技术之间的区别。但是现在有一种普遍的趋势是谈论“函数式语言”，这确实让我感到困惑。当然，像 Haskell 这样的一些语言比 C 等其他语言更欢迎函数式编程。但即
JavaScript美学: "function foo() {}" vs "var foo = function() {};" in AMD functions
关闭。这个问题是opinion-based 。目前不接受答案。想要改进这个问题吗？更新问题，以便 editing this post 可以用事实和引文来回答它。 . 已关闭 8 年前。 Improv
javascript - Function.call、Function.prototype.call、Function.prototype.call.call 和 Function.prototype.call.call.call 之间的区别
我在stackoverflow上查过很多类似的问题，比如call.call 1 , call.call 2 ，但我是新人，无法发表任何评论。我希望我能找到关于 JavaScript 解释器如何执行这些
google-cloud-functions - 从 Cloud Function 本身获取 Cloud Function 名称
向 Twilio 发送 SMS 时，Twilio 会向指定的 URL 发送多个请求，以通过 Webhook 提供该 SMS 传送的状态。我想让这个回调异步，所以我开发了一个 Cloud Functio
azure-functions - 如何获取使用 Terraform 部署的 Function-App 中的 "Function Url"？
作为 IaC 的一部分，A 功能应用，让我们将其命名为 FuncAppX 是使用 Terraform 部署的，它有一个内置函数。我需要使用 Terraform 在函数应用程序中访问相同函数的 Ur

首页

博学

6Ren·AI

商城

javascript - Summernote上传图片: onImageUpload and sendFile function not working