クリップボードにコピーする。
簡単かなと思ったけど、とても難しかったです。
ブラウザによって全然挙動が違うことに驚きました。
いろいろ試してみた結果をまとめています。
アドレスをコピーできたらいいなとか、たまにですが
あ、わかります
もくじ
【あれこれ①】ボタンをクリックしてIDをクリップボードにコピーする
See the Pen
【iOS】ボタンをクリックしてIDをクリップボードにコピーする by 125naroom (@125naroom)
on CodePen.
| ブラウザ | コピーできる？ |
|---|---|
| IE | 〇 |
| Edge | 〇 |
| Firefox | 〇 |
| Chrome | 〇 |
| Safari | 〇 |
| iOS Safari | 〇 |
| Android | △（機種によってできたりできなかったり） |
【あれこれ②】テキストをクリックしてクリップボードにコピーする
See the Pen
【iOS】テキストをクリックしてクリップボードにコピーする by 125naroom (@125naroom)
on CodePen.
| ブラウザ | コピーできる？ |
|---|---|
| IE | 〇 |
| Edge | 複数は×（リロードすればコピーはできるが） |
| Firefox | 〇 |
| Chrome | 〇 |
| Safari | 〇 |
| iOS Safari | 〇 |
| Android | △（機種によってできたりできなかったり） |
【あれこれ③】テキストをクリックしてクリップボードにコピーする、別パターン
See the Pen
【iOS 以外】テキストをクリックしてクリップボードにコピーする by 125naroom (@125naroom)
on CodePen.
| ブラウザ | コピーできる？ |
|---|---|
| IE | 〇 |
| Edge | 〇 |
| Firefox | 〇 |
| Chrome | 〇 |
| Safari | 〇 |
| iOS Safari | 複数は×（リロードすればコピーはできるが） |
| Android | 〇 |
【あれこれ④】clipboard.jsを使ってIDとパスワードをクリップボードにコピーする
ファイルをダウンロードする場合は、GitHubから「clipboard.min.js」ファイルをダウンロードする。
CDNを使う場合は、こちらを参照。
See the Pen
【clipboard.js】IDとパスワードをクリップボードにコピーする by 125naroom (@125naroom)
on CodePen.
| ブラウザ | コピーできる？ |
|---|---|
| IE | 〇 |
| Edge | 〇 |
| Firefox | 〇 |
| Chrome | 〇 |
| Safari | 〇 |
| iOS Safari | 〇 |
| Android | 〇 |
どれがいいのか
【あれこれ④】を使うのがいい。古いバージョンだと厳しかったりもすると思いますが。
個人的には、PCではわざわざ使う必要はないのかなと。スマートフォンで問題なく使えればいいのかなと。
さいごに
かわいいのがいいですね
パンおいしそうですね
