如何为 Summernote 的插入图像对话框设置图像扩展名

2024-01-16

我在用夏日笔记 https://summernote.org/一切正常,但有一件事我不明白。以下是我在 SummerNote 中使用的设置:

        summerNoteElement.summernote({
        toolbar: [
            ['magic', ['style', 'h1', 'h2', 'h3', 'h4']],
            ['actions', ['undo', 'redo']],
            ['style', ['bold', 'italic', 'underline', 'clear']],
            ['font', ['fontname', 'strikethrough', 'superscript', 'subscript']],
            ['fontsize', ['fontsize']],
            ['color', ['color']],
            ['para', ['ul', 'ol', 'paragraph']],
            ['height', ['height']],
            ['media', ['picture', 'video', 'link', 'table', 'hr']],
            ['insert', ['map', 'localmap']],
            ['uploadcare', ['uploadcare']],
            ['misc', ['help', 'fullscreen']] 
        ],
        height: 300,
        maximumImageFileSize: maxImageFileSize,
    }

Now I attach screenshots here to show what I want to change. So I click on the insert image button in the bar below: enter image description here

Then click Choose Files: enter image description here

Now if you select the file extensions you will see the list of image formats allowed: enter image description here

我喜欢做的是将这些扩展名限制为 JPG、BMP、PNG 等少数几个。

我是否缺少任何配置或执行此操作的技巧?谢谢。


Summernote没有这个选项来控制扩展名,它接受各种图像,但我需要释放以pdf上传的文件,并找到解决方案检查:

在 Summernote.js 的主文件中查找以下行:

'type = "file" name = "files" accept = "image / *" multiple = "multiple" />' +

并将accept =“image / *”更改为您想要的格式 前任:

' type="file" name="files" accept="image/gif,image/jpeg,image/jpg,image/png,application/pdf,application/vnd.ms-excel,application/msword, application/vnd.ms-powerpoint,text/plain" multiple="multiple" />' +

希望这可以帮助

对于那些需要完整代码的人来说,除了图像之外,服务器还通过 Summernote 发送 pdf 文件、doc、txt 等文件,如下所示:

Js code

$ (document) .ready (function () {

        (summernote) summernote ({
           toolbar: [
            ['myotherbutton', ['parameters']],
            ['style', ['style']],
            ['font', ['bold', 'italic', 'underline', 'clear'
            ['fontname', ['fontname']],
['fontsize', ['fontsize']],
            ['color', ['color']]
            ['for', ['ul', 'ol', 'paragraph']]
            ['table', ['table']],
            ['insert', ['link', 'picture', 'video', 'hr', 'codeview']]
],
lang: 'pt-BR',
height: 300,
minHeight: null,
maxHeight: null,
            callbacks: {
                onImageUpload: function (files) {
                    uploadFile (files [0]);
                },
onMediaDelete: function (target) {
                alert (target [0] .src)
                deleteFile (target [0] .src);
}
            }
        });

    function uploadFile (file) {
       
   data = new FormData ();
        data.append ("file", file);

        $ .ajax ({
            date: date,
            type: "POST",
            url: "../midia/upload.php", // replace with your url
            cache: false,
            contentType: false,
            processData: false,
            success: function (url) {

alert (url);

function checkURL (url) {
return (url.match (/ \. (jpeg | jpg | gif | png) $ /)! = null);
}

if (checkURL (url)) {

                var linkfile = url.split ("Images /");

alert (linkfile [1]);

$ image = "../midia/Images/"+linkfile[1];

$ ('# publisher'). summernote ("insertImage", $ image);

} else {

var linkfile = url.split ("Images /");

$ ('# publisher'). summernote ('createLink', {
text: linkfile [1],
url: url,
isNewWindow: true
});

}

            }
        });
    }

function deleteFile (src) {

    $ .ajax ({
        date: {src: src},
        type: "POST",
        url: "../midia/delete.php", // replace with your url
        cache: false,
        success: function (resp) {
            console.log (resp);
        }
    });
}


});

将 php 文件发送到文件夹 /media/

上传.php

  

<? php
      $ allowed = array ('png', 'jpg', 'gif', 'pdf', 'doc', 'docx', 'txt', 'mp3');
        if (isset ($ _ FILES ['file']) && $ _FILES ['file'] ['error'] == 0) {
            $ extension = pathinfo ($ _FILES ['file'] ['name'], PATHINFO_EXTENSION);
            if (! in_array (strtolower ($ extension), $ allowed)) {
                 echo 'AN ERROR OCCURED - INVALID IMAGE';
                exit;
            }
            if (move_uploaded_file ($ _FILES ['file'] ['tmp_name'], '../midia/Images/'.$_FILES['file']['name'])) {
                echo $ _SERVER ['SERVER_NAME']. dirname ($ _ SERVER ['PHP_SELF']). '/ Images /'.$_ FILES [' file '] [' name ']; // echo absolute file_url
                exit;
            }
        }
        echo 'AN ERROR OCCURED';
        exit;
?>

删除.php

<? php

$ url = explode ("Images", $ _ POST ['src']);

        $ file_name = str_replace ($ url [0], '', $ _ POST ['src']); // striping host to get relative path

        if (unlink ($ file_name))
        {
            echo 'file deleted!';
        }
?>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何为 Summernote 的插入图像对话框设置图像扩展名 的相关文章

  • 我可以对 JScript (.js) 或 VBScript (.vbs) 文件进行数字签名吗?

    我知道可以签署 Windowsbinary可执行文件使用signtool 所以一直以来我都假设人们无法签署由Windows Script Host 例如 JScript js 或 VBScript vbs 因为它们只是文本文件 但今天 在打
  • 如何保存带有缩进的 MSXML2.DomDocument? (我认为它使用MXXMLWriter)

    我有一个 MSXML2 DomDocument 的实例 我挥手将其保存 并缩进 此代码有效 但不缩进 var dom new ActiveXObject MSXML2 DomDocument fiddle with dom here dom
  • 找不到变量:$

    var scriptFile tempNode attr customJScriptSrc 当通过这个我得到 参考错误 找不到变量 请建议我任何替代方法 添加这个脚本 位于文档顶部 在 javascript 代码之前添加 或者下载该库并在代
  • Summernote - 从服务器删除图像

    您好 我已使用以下链接中的代码来允许将图像上传到服务器 Summernote 图片上传 如果用户从编辑器中删除图像 是否可以实现类似的操作以从服务器中删除图像 如果是这样 我该如何实现这一目标 要从服务器删除文件 您需要使用onMediaD
  • Windows Script Host (jscript):如何下载二进制文件?

    我正在尝试使用 Windows Script Host JScript 自动下载文件 我看到 ADODB Stream 有一个 Open 方法 其文档使它看起来应该可以打开 HTTP URL 并流式传输响应正文 var url http e
  • 如何使用 Summernote 重置文本区域

    提交后 表单中除 TEXTAREA 之外的所有字段都会被清除 我使用 Summernote 作为文本区域 使用引导程序 description是文本区域的 id 重置完成如下 submit box是表单的id description cod
  • Firebase - 'pushWithPriority' - 和验证

    我真的很想 优先推动 但这不存在 所以我计划进行不带参数的推送 然后使用返回的引用进行 setWithPriority 与文档中的示例类似 var messageListRef new Firebase https samplechat f
  • 从 javascript 运行 bat 文件

    我正在尝试使用 javascript 运行 bat 文件 我尝试过使用 powershell 但它似乎无法正常工作 这是我尝试过的代码 var oShell WScript CreateObject WScript Shell oShell
  • 如何在@Html.TextAreaFor()中使用@Html.Raw()

    我正在使用 Summernote 添加图像 视频 文本 另外 我将图像或视频保存为 Html 代码 该代码是字符串类型到数据库中 当我从数据库中检索视频或图像以在 Summernote 上显示时 需要将近 5 分钟 我不知道为什么 但是 当
  • Summernote createRange 与 HTML

    我的 Summernote 编辑器中的某些文本包含 HTML 我想要让用户选择的文本与编辑器中的文本完全相同 到目前为止我看到的所有答案都告诉我使用这个 summernote summernote createRange toString
  • 如何从网站执行vbscript

    我有一个 VBScript 文件 当它在计算机上时 它工作正常 我想将它放在一个 php 站点上 以便通过单击按钮来执行它 但我还没有成功 它实际上获取计算机信息 希望它能在用户的机器上运行 任何想法将不胜感激 如果或者如果有人知道如何用
  • Summernote div 更改时 Textarea 值发生变化

    我为 Summernote 设置了一个 div 来更改从数据库中提取的文本 div class form control div document ready function summernote summernote height 30
  • 使 HTA 文件以管理员身份运行(提升)

    在 wsf vbs 和 js 文件中 您可以轻松地找出它们是否运行提升 如果没有 您可以轻松地制作它们 我为此编写的代码是这样的 EnsureElevatedPrivileges WScript Echo Running elevated
  • 在 Internet Explorer 中是否有理由用 Script 替换 JavaScript?

    那么 当 JScript 与 JavaScript 不同时 IE 如何解释 jQuery 以及所有其他 JavaScript 将 IE 的 JavaScript 替换为 JScript 是否更好 是否存在性能差异 JScript 和 Jav
  • Summernote 图像上传和替代方案不起作用

    我在我的网站上使用 Summernote 编辑器 并使用其网站上提到的 Click2edit 方法实现它here http www usrtriton nl assets bower summernote example html 然而 如
  • 使用 C# 和 JScript 汇总表

    我用 C 编写了代码来总结以下值InvoiceTable并将这些汇总值移至GroupTable在 Abbyy FlexiCapture 中 该软件比较新 运行时没有显示任何错误 需要写两套代码 在科技领域 在事件处理程序中 InvoiceT
  • 在 JavaScript 中,当完成通过 new ActiveXObject 创建的对象后,我是否需要将其设置为 null?

    在 WSH 中运行并创建对象 例如 Scripting FileSystemObject 或任何任意 COM 对象 的 Javascript 程序中 完成后是否需要将变量设置为 null 例如 我建议这样做 var fso new Acti
  • 如何在 Windows 脚本宿主中使用 jQuery?

    我正在编写一些需要解析大量包含 HTML 片段的文件的代码 看起来 jQuery 对此非常有用 但是当我尝试将 jQuery 加载到 WScript 或 CScript 之类的内容中时 由于 jQuery 对窗口对象的许多引用 它会抛出错误
  • 将上传的图像插入 Summernote 编辑器

    我的目标是将上传的图像 本地文件 插入到 Summernote 编辑器中 图片上传成功 只需插入编辑器即可 我试图控制台记录编辑器实例 但它显示未定义 如果我可以将编辑器实例传递给sendFile功能 我想这个问题将会得到解决 jsfidd
  • Summernote onKeyup 事件未按预期工作

    我将 Summernote 编辑器应用于文本区域 我希望当我在编辑器中键入一些文本时 该文本应反映在 div 中 因此我有一个文本区域和一个 div result 其中应在每次按键时写入更改事件

随机推荐

  • 为什么 std::getline 不阻塞?

    我在 Objective C 类中 在 Objective C 文件中 有以下代码 NSString readString string res std getline cin res return NSString stringWithC
  • Android:如何使用 HttpsURLConnection 以编程方式登录网页

    我是 Android 新手 也是 Java 新手 如果我的问题是一个基本命题 那么很抱歉 我必须编写一个 Android 应用程序 在后台登录一个 aspx 网页 从中获取一些数据 然后从该网页注销 并以编程方式完成这一切 基本上 该过程就
  • 使用 datetime.strftime 显示时区偏移中的 : 字符 [重复]

    这个问题在这里已经有答案了 给出的格式字符串是什么strftime这将给出与我看到的相同的输出isoformat gt gt gt from datetime import datetime gt gt gt import pytz gt
  • MVVM - 视图逻辑:视图与视图模型[关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 应该 视图逻辑通常驻留在哪里 在视图中 包括后面的代码 还是在视图模型中 从逻辑上讲 我理解用于修改视图 使其动态 更改其元素属性的任何内容 V
  • 解析 JSON C# 错误

    我尝试获取 JSON 数据但出现错误 解析值时遇到意外字符 路径 行 0 位置 0 我正在使用 Net 4 5 和 JSON Net 框架 这是我的代码 WebClient net new WebClient string str awai
  • UIView 和 UITableView,reloadData 奇怪的延迟

    我的视图控制器的重画有些奇怪 视图控制器包含一个 UITableView 和一个微调器 我有一个更新提要函数 由 IBOutlet 触发 带来了spinner在我的视图控制器前面并放置一个doUpdate将函数放入 NSOperationQ
  • IE10 中的 jquery UI Draggable 通过滚动条拖动时出现 bug

    我有一个带有可拖动元素的 div 它在所有浏览器中都工作得很好 除了 IE10 存在一个问题 如果您尝试通过滚动条拖动该元素 它会滚动 直到您松开鼠标 在这种情况下该元素将捕捉到鼠标的当前位置 我已经设置了这个小提琴 http jsfidd
  • 如何在 PHP 中创建新运算符?

    我看到自己在执行以下代码来默认分配 PHP 上的所有类型 variable variable variable default value 我知道 5 3 我可以做到 variable variable default value 我想通过
  • 如何替换python3中的has_key?

    我尝试安装自动自我控制 https github com andreasgrill auto selfcontrol并在执行此命令时卡住 sudo usr bin python auto selfcontrol py 它显示错误 Attri
  • 如何将 Spring Boot 配置元数据文件转换为 HTML

    我确信一定有一种优雅的转身方式Spring Boot配置元数据文件 https docs spring io spring boot docs current reference html configuration metadata ht
  • 编译成功后找不到exe

    使用opencv在microsoft Visual Studio 2008中成功调试人脸检测代码后 找不到可执行文件 没有错误 只有三个警告 但它表明构建已成功 您可以进入项目设置并检查输出文件夹 在那里查找二进制文件 二进制不一定意味着e
  • 重命名 gtsummary、tbl_regression/tbl_stack 中的行

    我正在使用 gtsummary 并使用 tbl regression 和 tbl stack 函数将 11 个不同模型的输出堆叠在一起 我希望了解一个一致自变量的优势比在不同感兴趣的因变量之间如何变化 当我打印 tbl stack 输出时
  • 如何解码令牌并获取 Django 的 djangorestframework-jwt 包的信息

    我已经开始使用 djangorestframework jwt 包而不是 PyJWT 我只是不知道如何解码传入的令牌 我知道有验证令牌方法 我需要知道的是如何解码令牌并返回信息编码 我使用此方法来解码令牌并验证用户 首先我没有使用algor
  • 以编程方式为 DataGrid 创建 WPF DataGridTemplateColumn

    我希望能够根据我的数据源以编程方式创建 DataGridTemplateColumns 例如 如果我的源在特定列中有一个日期 我希望能够利用 Datepicker 控件 我知道这可以在设计时使用 xaml 和 DataGridTemplat
  • 运行 rake 任务时如何跳过 Rails 初始值设定项的加载?

    我的 Rails 应用程序有一个网站爬虫 它加载爬虫在 Rails 初始化程序中使用的身份验证凭据config initializers 初始化程序通过调用 SiteLogin 模型中的模型方法来加载身份验证 当我跑步时rake db mi
  • 如何确保 Twitter Bootstrap 3 中的列均匀换行?

    如果我有未知数量的要显示的项目 每个项目都在自己的列中 有没有办法让它们均匀换行 而不必为每个项目创建新行 I have div class row div class col md 3 col sm 4 col xs 6 h1 Title
  • 位置始终返回“未知”

    我刚刚在真实设备上尝试了我的第一个 WP7 应用程序 我的问题是我使用地理定位来实现其中一项功能 但我总是得到位置未知 我不知道是否有任何方法可以向我的应用程序授予位置权限 或者我是否遗漏了某些内容 在手机设置中 定位服务已启用 地图应用程
  • 将云端端点模型类序列化到Android文件系统的方法

    我已经成功创建了一个云端点模型 可以轻松地从 App Engine 检索信息 为了减少往返次数并提供更快的用户体验 我确定了一个希望存储到本地存储的实例 在我的应用程序的其余部分中 我使用 ObjectInputStream 来读取和写入对
  • 使用 Visual Studio Code 对齐多行编辑光标

    使用 Visual Studio Code 的多行编辑功能 如果空白尚不存在 是否可以轻松对齐行尾列中的所有光标 类似于 Notepad 的功能 由此 To this 迈克 摩尔 Mike Moore 有这个扩展 https marketp
  • 如何为 Summernote 的插入图像对话框设置图像扩展名

    我在用夏日笔记 https summernote org 一切正常 但有一件事我不明白 以下是我在 SummerNote 中使用的设置 summerNoteElement summernote toolbar magic style h1