实现网页编辑直接粘贴图片功能

阳光穿透心脏的1/2处 2022-01-27 09:13 320阅读 0赞

> 参考：
> 
> [让富文本编辑器支持复制doc中多张图片直接粘贴上传][doc]  [https://www.cnblogs.com/ycbt/p/10037809.html][doc]
> 
> KindEditor4.1.10,支持粘贴图片  [https://blog.csdn.net/jimmy0021/article/details/73251406][https_blog.csdn.net_jimmy0021_article_details_73251406]

页面代码：

<html>
    
    <body>
    <textarea ></textarea> 
    <div contenteditable style="width: 100px;height: 100px; border:1px solid"> 
    </div> 
    <script> 
    document.addEventListener('paste', function (event) { 
      console.log(event) 
    })
    </script>
    </body>
    </html>

效果图

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3lhbl9kaw_size_16_color_FFFFFF_t_70][]

持续完善，待续...

[doc]: https://www.cnblogs.com/ycbt/p/10037809.html
[https_blog.csdn.net_jimmy0021_article_details_73251406]: https://blog.csdn.net/jimmy0021/article/details/73251406
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3lhbl9kaw_size_16_color_FFFFFF_t_70]: /images/20220127/700a082035d24705b19d5072624ed818.png

发表评论取消回复

表情：

评论列表（有 0 条评论，320人围观）

还没有评论，来说两句吧...

相关阅读

相关 js 实现复制粘贴功能

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8...

本是古典何须时尚/ 2024年04月18日 21:58/ 0 赞/ 88 阅读

相关网页编辑软件Whisk mac中文版功能介绍

Whisk for Mac中文版是一款网页编辑器，Whisk mac版具有实时预览，可在您键入时更新。Whisk是您工具包中用于HTML，PHP，CSS和javascript编

你的名字/ 2024年03月02日 09:57/ 0 赞/ 99 阅读

相关 js实现粘贴板功能 (实用）

原文出处：[https://blog.csdn.net/qq\_24184997/article/details/80769734][https_blog.csdn.net_q

清疚/ 2023年07月11日 11:15/ 0 赞/ 6 阅读

相关 JavaScript实现复制和粘贴功能

1.前期准备考虑到兼容性，我们实现复制功能使用clipboard.js框架。参照如下地址下载： > [https://cdn.bootcss.com/clipboar

以你之姓@/ 2022年11月22日 00:25/ 0 赞/ 296 阅读

相关 clipboard 实现复制粘贴功能

<el-form-item label="ticketKey"> <span id="code">{ { baseForm.ticketKe

电玩女神/ 2022年10月31日 00:42/ 0 赞/ 309 阅读

相关前端图片编辑功能的实践小结

![db5ba2f3176922ee7da7e6dc4a8c2bb4.gif][] 我们在发布器上提供了图片编辑功能，去支持封面图的编辑，并且统一多端协议，打通素材中心，实现

逃离我推掉我的手/ 2022年09月12日 11:58/ 0 赞/ 149 阅读

相关 JS 实现复制粘贴功能

JS 实现复制粘贴功能目前没有做过多的测试，只是测试了几个手机，介绍：支持情况（1）移动端： 1. chrome（版本 58.0.3029.96 (64

柔光的暖阳◎/ 2022年06月15日 04:57/ 0 赞/ 289 阅读

相关 tinymce实现从word直接粘贴

原文地址：[https://www.jianshu.com/p/b9f3e566a9ce][https_www.jianshu.com_p_b9f3e566a9ce] 我们需

电玩女神/ 2022年05月15日 10:29/ 0 赞/ 1258 阅读

相关前端js实现粘贴图片到可编辑的div(其他标签也可)中

输入框中要实现粘贴图片功能，不能用input、textarea等输入框作为父容器，因为input、textarea中只能接受字符串，对于html标签不进行转义以及渲染。所以

叁歲伎倆/ 2022年03月12日 14:26/ 0 赞/ 469 阅读

相关实现网页编辑直接粘贴图片功能

> 参考： > > [让富文本编辑器支持复制doc中多张图片直接粘贴上传][doc] [https://www.cnblogs.com/ycbt/p/10037809.ht

阳光穿透心脏的1/2处/ 2022年01月27日 09:13/ 0 赞/ 321 阅读