快捷導(dǎo)航

Js+Flash實(shí)現(xiàn)訪問剪切板操作

更新時(shí)間：2012年11月20日 09:27:17 作者：

最近需要遇到了這個(gè)問題點(diǎn)擊按鈕復(fù)制鏈接的功能果斷度娘谷哥,最后找到得解決方案ZeroClipBoard一款開源得js+Flash實(shí)現(xiàn)得剪切板操作

最近需要遇到了這個(gè)問題點(diǎn)擊按鈕復(fù)制鏈接的功能果斷度娘谷哥。最后找到得解決方案ZeroClipBoard一款開源得js+Flash實(shí)現(xiàn)得剪切板操作
但是搜尋了眾多例子之后發(fā)現(xiàn)大多都是介紹一個(gè)頁面只有一個(gè)固定的復(fù)制操作

而我得需求是這樣
一個(gè)動(dòng)態(tài)Repeater動(dòng)態(tài)加載出各個(gè)地址和復(fù)制按鈕。
這個(gè)解決方案得原理是：
拿js動(dòng)態(tài)加載一個(gè)透明flash.然后遮蓋到你要點(diǎn)擊得按鈕上面,之后在給這個(gè)flash得承載元素上綁定事件動(dòng)態(tài)把要復(fù)制得值傳遞到flash中,用flash訪問剪切板.
這時(shí)候就出現(xiàn)這么一個(gè)問題多個(gè)按鈕如果每個(gè)按鈕都加栽一遍flash得話會(huì)很吃內(nèi)存并且動(dòng)態(tài)得代碼也不是很好寫
最后得解決方案如下:

復(fù)制代碼代碼如下:

 
<divid="ClipSwf"style="left:-1000px;position:absolute;width:80px;height:25px;"></div> 

1.現(xiàn)在Body中放置一個(gè)隱藏得flash容器絕對(duì)定位

復(fù)制代碼代碼如下:

 
varLocalUrlManage={ 
Clip:null, 
ClipContainer:null, 
InitClip:function(){ 
LocalUrlManage.Clip=newZeroClipboard.Client(); 
LocalUrlManage.ClipContainer=$("#ClipSwf"); 
LocalUrlManage.Clip.setHandCursor(true); 
LocalUrlManage.Clip.setCSSEffects(true); 
LocalUrlManage.Clip.addEventListener("complete",function(client,text){ 
Tip.RightTip("#UrlAdd",text+","+"復(fù)制成功!"); 
}); 
LocalUrlManage.ClipContainer.html(LocalUrlManage.Clip.getHTML(80,25)); 
}} 

2.使用js在頁面加載完成得時(shí)候初始化剪切板的對(duì)象并設(shè)置鼠標(biāo)手勢(shì)和承載容器然后把flash輸出成html輸出到容器中

復(fù)制代碼代碼如下:

 
onmouseover="LocalUrlManage.SetClipValue(this,'#copyUrlValue<%#Eval("Id")%>')">點(diǎn)擊復(fù)制</button> 

復(fù)制代碼代碼如下:

 
SetClipValue:function(obj,SelectorEl){ 
//BrowserClip.IEClip($(SelectorEl).val()); 
varoffset=$(obj).offset(); 
LocalUrlManage.ClipContainer.offset({left:offset.left,top:offset.top}); 
LocalUrlManage.Clip.setText($(SelectorEl).val()); 
}. 

3.在各個(gè)復(fù)制按鈕上動(dòng)態(tài)綁定事件并把響應(yīng)的要復(fù)制得值或者控件傳遞到function中之后設(shè)置隱藏flash容器得left,top邊距讓其漂浮在觸發(fā)該事件得按鈕上并把要復(fù)制的值通過
Clip.setText('text')(插件提供得方法)傳遞給flash這樣就實(shí)現(xiàn)了多個(gè)按鈕復(fù)制得功能
未解決問題,原本按鈕得hovercss切換效果flash遮蓋之后就不太靈活了。用jquery動(dòng)態(tài)添加樣式效果也不太好。

您可能感興趣的文章: