11

私のアプリでは、ユーザーが画像を右クリックして画像をディスクに保存できるようにする必要があります。ただし、私の特定のコードでは、ユーザーが最初Open image in new tabに選択し、そこからSave image as...

他のすべての主要なブラウザー (モバイル Chrome を含む) は期待どおりに動作するため、コードを標準/正しい方法で実装していないのか、問題が Chrome にあるのかわかりません。

例：

次の HTML は、私がやっていることを簡略化したものです。ボタンをクリックして、画像を含む新しいウィンドウを開くことができます。

上記の問題をテスト/確認するには、画像を右クリックして [Save image as..何も起こらないことに注意してください] を選択します。ただし、画像を右クリックして を選択すると、そこからOpen image in new tab移動できますSave image as..。

<html>
<head>
    <title></title>
    <script>
        function foo() {
            var tab = window.open();
            tab.document.write('<p>Right-click, then click "Save image as ..."</p><img src="http://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png" />');
        }
    </script>
</head>
<body>
    <button onclick="foo();">Open</button>
</body>
</html>

window.open()これはChromeの問題ですか、それともChromeを他のブラウザのように動作させるために一緒に使用できる別の方法がありdocument.write()ますか（つまり、最初にOpen image in new tab.

4

1 に答える 1

14

うまくいくと思われる解決策を見つけました。タブに場所属性を持たせます。これが必要な理由はわかりませんが、Chrome 48 で動作します。

document.write('<html>
<head>
    <title></title>
    <script>
        function foo() {
            var tab = window.open();
            tab.document.write('<p>Right-click, then click "Save image as ..."</p><img src="http://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png" />');
            tab.document.location = "#";
        }
    </script>
</head>
<body>
    <button onclick="foo();">Open</button>
</body>
</html>');
于 2016-12-12T22:00:28.437 に答える