テキストコピー
デモ
押してください
このテキストをコピーします。
1234567890
ABCDEFGHIJKLMN
JSコードコピー
使い方
コピーのトリガーになる任意の要素を用意し、data-jscopyand="copytext"を付与してください。
コピーされるテキストを用意し、それを囲う要素に任意のidを付与してください。
コピーのトリガーになる要素にdata-jscopyand-attributes="id名"を付与してください。
解説
このテキストコピー機能は1画面で複数の設置を想定しているため、document.querySelectorAllでトリガーとなる全ての要素を取得し、変数に格納します。
取得した全トリガー要素に対して反復処理を行い、イベントを設定していきます。
トリガー要素が持っているdata-jscopyand-attributes属性を使い、コピーの対象となる要素を特定します。
もしも対象の要素が存在しなかった場合は処理を終了します。
コピーにはwindow.navigator.clipboard.writeTextという機能を使用します。
引数にコピーする文字列target.innerTextを渡します。
コピーが完了した時の処理をthenというメソッドに関数を渡してしています。
本デモではアラートでコピー完了をお知らせします。
ヘルプ・コンタクト
機能に関するご質問は、このページの下部に表示されている Twitter
のアイコンから Twitter に遷移後、 DM 等でご連絡ください。
導入サポートやカスタマイズも有償にてお受け致しますので、 DM
等でご連絡ください。