10

「貼り付け」イベントを処理するための Safari 用のコードを書き込もうとしていますが、正しく動作しないようです。WebKit DOM リファレンスによると、oncutonpaste、およびoncopyはすべて、多かれ少なかれ W3C クリップボード API が示唆するように処理されます。ただし、期待どおりには機能しません。画像データを貼り付けていますが、私が知る限り、問題はどの種類の貼り付けにも当てはまります。このjsfiddleは Chrome では問題なく動作しますが、OSX の Safari 6.0.4 では動作しません。

$(function () {
    console.log("ready");
    $("#pastearea").on("paste", function (e) {
        e.preventDefault();
        console.debug("testing paste in safari");
        var blob = e.originalEvent.clipboardData.items[0].getAsFile();
        console.debug(blob);
        var reader = new FileReader();
        reader.onload = readerLoaded;

        reader.readAsDataURL(blob);
    });
});

function readerLoaded(e) {
    $("#dest").attr("src", e.target.result);
}

単純な JSだけを使用して再試行しました。まだ喜びはありません:

<div id="pastearea" onpaste="plainjsOnPaste()" style="width: 100px; height: 100px; background-color: blue;"/>

function plainjsOnPaste(e) {
    console.log("blahblahblah");
    console.log(e);   
}

Safari に何らかの問題がある場合、明らかに jQuery が機能するとは期待できません。私が知る限り、2 回目の試行 (プレーン) では、WebKit のリファレンスで推奨されていることを正確に実行していますが、まったく機能しません。これは Safari の既知の制限ですか、それとも椅子とキーボードの間の問題ですか?

更新: Safari は、クリップボード API の W3C のワーキング ドラフトを実装していないようです。回避策を調べているのですが、ご存知の方がいらっしゃいましたら教えていただきたいです。

4

2 に答える 2

10

答えは、満足できないかもしれませんが、「いいえ」だと思います。この WebKit バグを参照してください。

https://bugs.webkit.org/show_bug.cgi?id=75891

contentEditable、テキスト入力、またはテキスト領域ではないものに貼り付けデータを受け取ることを意図している場合、現在のバージョンの Safari でこれを行う方法はわかりません。

更新:この JSFiddleで試行された回避策は、テキストのみを処理するように簡略化されていますが、Safari 6.0.5 では機能しません。Safari での貼り付けを有効にするために、Cmd-V が押されたときに非表示のテキスト フィールドが自動的にフォーカスされる回避策を試みます。「ビープ音を貼り付けることができません」を防ぎますが、貼り付けイベントは送信されず、秘密の入力には何も貼り付けられません。

$(function () {
    $(window).bind('keydown', function (e) {
        // Cmd-V
        if (e.which == 86 && e.metaKey) {
            if (e.target.nodeName.toUpperCase() !== "INPUT")
                $('#secretinput').focus();
        }
    });

    $(window).bind('beforepaste', function (e) {
        return false;
    });

    $(window).bind('paste', function (e) {
        var clipboardData = e.originalEvent.clipboardData;
        console.log(clipboardData);
        $('#textdest').html(clipboardData.getData('text/plain'));
    });
});
于 2013-06-14T09:33:19.380 に答える