Skip to content

Instantly share code, notes, and snippets.

@marorika

marorika/clipboard-bootstrap.html

Created January 30, 2018 16:13
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save marorika/9d77909b3189590968cc40cc116e3ab3 to your computer and use it in GitHub Desktop.
Save marorika/9d77909b3189590968cc40cc116e3ab3 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
clipboard-bootstrap.html
<body>
〜〜〜
<!-- コピー対象要素とコピーボタン -->
<div class="container-fluid mx-0">
<div class="form-group row">
<input class="border border-info rounded text-secondary form-control-plaintext col-10" id="omakeCopyTarget" type="text" value="おまけ" readonly>
<button type="button" class="btn btn-info col" onclick="omakeCopyToClipboard()" data-toggle="tooltip" data-placement="top" title="コピーする">
<i class="fas fa-clipboard"></i>
</button>
</div>
</div>
〜〜〜
<!-- bodyタグ内の下部に以下を入力する -->
<script>
function omakeCopyToClipboard() {
// コピー対象をJavaScript上で変数として定義する
var copyTarget = document.getElementById("omakeCopyTarget");
// コピー対象のテキストを選択する
copyTarget.select();
// 選択しているテキストをクリップボードにコピーする
document.execCommand("Copy");
// コピーをお知らせする
alert("コピーできました！ : " + copyTarget.value);
}
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment