• Favorite list is empty.
Loading

HOME > > jQueryjQuery テキスト自動コピーの実装方法 – クリップボードへのテキストコピー

WRITTEN By Kenta Toshikura

jQuery テキスト自動コピーの実装方法 – クリップボードへのテキストコピー

このTIPSは1年以上前に書かれた古い投稿になります。記事によっては不適当な記述もありますので、参考程度に留めてください。

どうもこんばんは。今回は【jQuery テキスト自動コピーの実装方法 – クリップボードへのテキストコピー】というメモです。本方法では【jQuery ZeroClipboard】というプラグインの力を借ります。シンプルかつ安定して使える優良なプラグインですので機会があれば使ってみても。

実装方法

インプットや指定した要素、テキストエリアまで様々な要素の内容がコピー可能です、クリップボード内に保存させますので容量には注意が必要です。

【zClip】プラグインのダウンロード
JS

<script src="js/jquery-1.X.X.min.js"></script>
<script src="js/jquery.zclip.min.js"></script>
jQuery

$("a#copybtn1").zclip({
path:"ZeroClipboard.swf",
copy:$("input#text1").val(),
beforeCopy:function(){
//コピー前の操作
$(‘#copybtn1′).text(‘COPY’);
},
afterCopy:function(){
//コピー後の操作
$(‘.btn’).text(‘COPY’);
$(‘#copybtn1′).text(‘COPIED’);
}
});
HTML


<input id="text1" type="text" value="これはinputコピー用のテキストです。">
<a id="copybtn1" class="btn">COPY</a>

 
以上になります。

Similar
Post