masalibの日記

システム開発、運用と猫の写真ブログです

JavaScriptでクリップボードに文字をコピーする(ブラウザ)

クリップボードにコピーする機能はブラウザによって微妙にことなる

IE

window.clipboardData.setData

chrome,FireFox

document.execCommand

Edgeはうまいこと動かないのであきらめた

作成した機能としてはボタンがあっておされると該当の内容がコピーされる機能。
パラメータ(val)でわたさなくてid指定でもOKだと思う、古いシステムに導入でそこは考慮しないことにした

呼び出し側

<input type="button" value="コピー" OnClick="setClipBord('XXXXX')" class="button" />

クリップボードにコピーする関数

 function setClipBord(val)
    {
        var userAgent = window.navigator.userAgent.toLowerCase();
        var ua = navigator.userAgent;
        console.log(ua);
        if (ua.indexOf("Edge") >= 0 )
        {
            alert("MicroSoft Edgeはコピー機能が使えません");

        } else if( userAgent.match(/(msie|MSIE)/) || userAgent.match(/(T|t)rident/) ) {
            var ieVersion = userAgent.match(/((msie|MSIE)\s|rv:)([\d\.]+)/)[3];
            ieVersion = parseInt(ieVersion);

            window.clipboardData.setData("Text", val);
            alert("クリップボードにコピーしました。"+ val);
        } else {
            var input = document.createElement('input');
            input.setAttribute('value', val);
            document.body.appendChild(input);
            input.select();
            var result = document.execCommand('copy');
            document.body.removeChild(input)
            //return result;
            alert("クリップボードにコピーしました。"+ val);
        }
    }