Asp.Net + Javascript 複製文字到剪貼簿目前最佳解決方案 ZeroClipboard

ZeroClipboard 原理是在 DOM元件上覆蓋一層flash ,在各家瀏覽器上較為通用
本範例由使用C#後台丟串字到前台( tb_link.Text) ,再經由 button 進行複製動作 IE9 ,CHrome 測試OK,
1.到 ZeroClipBoard 網站下庫javascript 程式 ,並將程式解開放入專案中

2.在 <HEAD></HEAD> 中插入

 <script src="ZeroClipboard.js" type="text/javascript"></script>
<script type="text/javascript"> ZeroClipboard.setMoviePath('ZeroClipboard.swf'); //指定code 所在路徑路徑</script>
<script type = "text/javascript">
$(function() {
ZeroClipboardInit();
});
function ZeroClipboardInit() {
var clip = new ZeroClipboard.Client();
//複製完成彈出訊息
clip.addEventListener('complete', function(client, text) {
alert("已複製到剪貼簿");
});
//指定複製來源ID
clip.setText(document.getElementById('tb_link').value);/
clip.glue('btn_copy');//'BtnExport'指某个DOM元素（如：Button）的ID
}
</script>

$(function() {

ZeroClipboardInit();

});

function ZeroClipboardInit() {

var clip = new ZeroClipboard.Client();

//複製完成彈出訊息

clip.addEventListener('complete', function(client, text) {

alert("已複製到剪貼簿");

});

//指定複製來源ID

clip.setText(document.getElementById('tb_link').value);/

clip.glue('btn_copy');//'BtnExport'指某个DOM元素（如：Button）的ID

}

</script>

3. 在 <body></body> 中插入

<asp:TextBox ID="tb_link" runat="server" Width="300"  text="要被複製的文字"></asp:TextBox>
<br />
<asp:Button ID="btn_copy" runat="server" Text="複製連結" />

<asp:TextBox ID="tb_link" runat="server" Width="300" text="要被複製的文字"></asp:TextBox>

<br />

<asp:Button ID="btn_copy" runat="server" Text="複製連結" />

2011/12/23更新:

1	2011/12/23更新:

在覆蓋DOM元件的FLASH 有時不會在正確位置上 , 目前已知原因有 page 的resize 事件,

1	在覆蓋DOM元件的FLASH 有時不會在正確位置上 , 目前已知原因有 page 的resize 事件,

zerocipboard 有提供相對應的元件

1	zerocipboard 有提供相對應的元件

reposition()

1	reposition()

有查到用法

有查到用法

<span>window.onresize = function() {clip.reposition();};</span>

1	<span>window.onresize = function() {clip.reposition();};</span>

<span><br /></span>

1	<span><br /></span>

而我遇到的是在上方加一個圖片時,FLASH 還停留在上方,我想應該該是載入順序的問題,

1	而我遇到的是在上方加一個圖片時,FLASH 還停留在上方,我想應該該是載入順序的問題,

想說用 window.onload 解決 , 可惜java 真的跟他不是很熟,轉個方向先把高成先定出來,倒也可以解決

1	想說用 window.onload 解決 , 可惜java 真的跟他不是很熟,轉個方向先把高成先定出來,倒也可以解決

所以當使用使效語法又沒有錯時 , 可以上該元件的附近找找有沒有可以點擊的地方 , 有可能是位置跑掉了 ...

1	所以當使用使效語法又沒有錯時 , 可以上該元件的附近找找有沒有可以點擊的地方 , 有可能是位置跑掉了 ...

(Visited 56 times, 1 visits today)

Follow us