按Ctrl + V上传屏幕截图 [英] Upload screenshots by Ctrl+V

问题描述

据我所知这是不是 可能通过钩住粘贴事件通过JavaScript。
但我在 trello.com

上找到了这样的东西如何重现：

仅适用于Windows和Chrome浏览器我无法在linux ff或chrome上复制它

1. 创建新卡片


2. 点击它 - >出现表格


3. 点击评论文本区


4. 通过 PrnScr ， Ctrl + V - > b $ b进度条右上角）
   

那么他们如何实现它？

event.clipboardData.items 。

javascript代码（此处）被缩小了，因此不是特别容易阅读，但它基本上归结为应用在其他 question

粘贴处理程序的提取：

（b）{
var c，f，e，g，h，k，m，l;
e = null;
h = this.handlers;
for（g in h）
if（c = h [g]，null！= c.paste）{
e = c.paste;如果（空！= e&&（f = null！=（k = null！=（m = b.originalEvent））=空！=（l = m.clipboardData）？l.items：void 0：void 0）？k：[]，b = function（b）{
return _.detect（f，function（c）{
return c .type === b
}）
}，！b（text / plain）&&（b = b（image / png），null！= b&& amp ;（b = b.getAsFile（），null！= b））））return j.validFileSize（b）？ （n（Keyboard Shortcuts，Paste - Upload Image From Clipboard），e（b））：P.show（文件大小超过10mb limit，
error，upload，5E3）
};

As I know it is not possible to upload the files by hooking paste event by javascript.
But I have found such thing on trello.com
How to reproduce:

Only on windows and with google chrome I can'not reproduce it on linux ff or chrome

1. Create a new card
2. Click on it -> it's form appeared
3. Click on comment text area
4. Make screenshot by PrnScr, Ctrl+V -> upload process started (green progress bar in right top corner)

So how do they implemented it?

解决方案

In Trello, they use an event handler registered on the paste event and basically accessing event.clipboardData.items.

The javascript code (here) is minified, hence not particularly easy to read, but it basically boils down to applying the trick found in that other question

Extract of the paste handler:

        c.prototype.paste = function (b) {
            var c, f, e, g, h, k, m, l;
            e = null;
            h = this.handlers;
            for (g in h)
                if (c = h[g], null != c.paste) {
                    e = c.paste;
                    break
                }
            if (null != e && (f = null != (k = null != (m = b.originalEvent) ? null != (l = m.clipboardData) ? l.items : void 0 : void 0) ? k : [], b = function (b) {
                return _.detect(f, function (c) {
                    return c.type === b
                })
            }, !b("text/plain") && (b = b("image/png"), null != b && (b = b.getAsFile(), null != b)))) return j.validFileSize(b) ? (n("Keyboard Shortcuts", "Paste - Upload Image From Clipboard"), e(b)) : P.show("File size exceeds 10mb limit",
                "error", "upload", 5E3)
        };    

这篇关于按Ctrl + V上传屏幕截图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！