ホームページ > 記事 > ウェブフロントエンド > JSで作ったクリックコピーエフェクト
JSで作ったクリックコピーエフェクト
- php中世界最好的语言オリジナル
- 2018-03-12 11:37:311857ブラウズ
今回はJSで作ったClick-to-Copyエフェクトをお届けします。 JSで作ったClick-to-Copyエフェクトの注意点は以下の通りです。
原則:
例
<!DOCTYPE html><html><head>
<meta charset="UTF-8">
<title>复制</title></head><body>
<script>
var textCopy=function (data) { var f=document.createElement("form");
f.id="copy-"+Date.parse(new Date());
f.onsubmit=function(){return false};
f.style="opacity: 0;height: 1px;width: 1px;overflow: hidden;position:fixed;top: -1;left: -1;z-index: -1;"
f.innerHTML=`<button onclick='story.select();document.execCommand("Copy");'></button>
<textarea name="story">${data}</textarea>`; document.body.appendChild(f); document.querySelector(`#${f.id}>button`).click();
document.body.removeChild(document.getElementById(f.id));
}
</script>
<input id="test" value="" />
<button onclick="textCopy(document.getElementById('test').value)" >复制</button> </body></html>この記事の事例を読んだ後は、この方法を習得したと思います。 PHP 中国語 Web サイトの他の関連記事にも注目してください。
関連書籍:
nodejs http モジュールを使用してアップロードイメージインターフェイステストクライアントを作成する方法 h5 のパフォーマンス変化折れ線グラフを作成する方法 nodejs jsonp を介してシングルサインオンを実装する方法以上がJSで作ったクリックコピーエフェクトの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。