web-dev-qa-db-ja.com

iPhoneデバイスでクリップボードのコピーアンドペーストを機能させる

私はWebアプリケーションを持っていますが、これは主にモバイルデバイスで実行するように設計されています。渡されたテキストをデバイスのクリップボードにコピーするボタンが1つあります。そのためにJavaScriptを使用しています。私のコードは、iphoneとipadを除くすべてのモバイルデバイスでうまく機能しています。何が問題になるのか誰か知っていますか?これが私のコードです:

CopyToClipboard = function(text, fallback){
    var $t = $('<textarea />');
    $t.val(text).appendTo('body');
    $t.select();
    document.execCommand('copy');
    $t.remove();
    return true;   
};

私もこのようにしようとしましたが、結果はなく、まだiPhoneで動作していません

function detectIE() {
    var ua = window.navigator.userAgent;

    var msie = ua.indexOf('MSIE ');
    if (msie > 0) {
        // IE 10 or older => return version number
        return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
    }

    var trident = ua.indexOf('Trident/');
    if (trident > 0) {
        // IE 11 => return version number
        var rv = ua.indexOf('rv:');
        return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
    }

    var Edge = ua.indexOf('Edge/');
    if (Edge > 0) {
        // IE 12 => return version number
        return parseInt(ua.substring(Edge + 5, ua.indexOf('.', Edge)), 10);
    }

    // other browser
    return false;
}
function copytext(text) {
    if (detectIE()) {
        window.clipboardData.setData('Text', text);
    }
    var textField = document.createElement('textarea');
    textField.innerText = text;
    document.body.appendChild(textField);
    textField.select();
    document.execCommand('copy');
    window.clipboardData.setData('Text', copytext);
    textField.remove();
}

function copytext(text) {
    var textField = document.createElement('textarea');
    textField.innerText = text;
    document.body.appendChild(textField);
    textField.select();
    document.execCommand('copy');
    $(textField).remove();
}
11
Anna Gabrielyan

これを試して。私のために働きます。

var copy = function(elementId) {

        var input = document.getElementById(elementId);
        var isiOSDevice = navigator.userAgent.match(/ipad|iphone/i);

        if (isiOSDevice) {
          
                var editable = input.contentEditable;
                var readOnly = input.readOnly;

                input.contentEditable = true;
                input.readOnly = false;

                var range = document.createRange();
                range.selectNodeContents(input);

                var selection = window.getSelection();
                selection.removeAllRanges();
                selection.addRange(range);

                input.setSelectionRange(0, 999999);
                input.contentEditable = editable;
                input.readOnly = readOnly;

        } else {
                input.select();
        }

        document.execCommand('copy');
}
<input type="text" id="foo" value="text to copy" />
<button onclick="copy('foo')">Copy text</button>
26
Rikard Askelöf

CanIUse によると、iOS上のSafariはdocument.execCommand('copy')をサポートしていません。これは、おそらくセキュリティ上の理由によるものです。

0
Cube.