簡単な JavaScript で HTML の表示要素をクリップボードにコピーする
例えばプロダクトキーや API キーなど、長くて複雑な文字列を、訪問者に提供している場合、この機能を提供することで、訪問者のクリップボードに文字列をコピーして、その後はペーストだけすればよい、という形で利便性を高めることができます。
HTML
<p id="campaign-code">VjBpRLpQkr5GniGG7J5PxUa7CXmZKuzD</p>
<p><a href="javascript:clipboard();"><i class="fa fa-clipboard" aria-hidden="true"></i> <span id="clipboard-info">コードをクリップボードにコピーする</span></a></p>JavaScript
<script>
function clipboard(){
var text = document.getElementById('campaign-code').innerText;
navigator.clipboard.writeText(text).then(e => {
document.getElementById("clipboard-info").innerText = "コピーしました.";
});
}
</script>サンプル
VjBpRLpQkr5GniGG7J5PxUa7CXmZKuzD
