ZeroClipboard外掛的多div繫結
阿新 • • 發佈:2018-12-30
建議有多少個地方使用就繫結多少個div,但是動態的真不好控制,只有一次性把需要的地方全部初始化。動態繫結的簡直動不起來。我已經吐血。
我用jquery了,你們要相容性的去參考其它人的吧。
1、ZeroClipboard使用的前提。
1-1、ZeroClipboard使用的檔案。
1-2、ZeroClipboard引用。
2、頁面的html資料結構配合。
2-1、id這個是必須的。
2-2、幾個事件也是必須的。
1、新建ZeroClipboard資料夾,複製必須的檔案。 1-1、複製 ZeroClipboard.js ;ZeroClipboard.swf兩個檔案進去【外掛我也是現搜尋的,別誤會,重要的是實現的過程】。 1-2、開始:<script src="/ZeroClipboard/ZeroClipboard.js" type="text/javascript"></script>
2、這幾個id我是用好幾個隨機數變整數互相乘積隨機拼接出來的。
<div id="a1">內容1</div>
<div id="a32">內容2</div>
<div id="a13">內容3</div>
2-1、我們必須要在頁面中知道其中一個div的id,這樣我們才能繼續下來,也許你看了我的程式碼後發現我理解錯了,請告訴我,謝謝。
2-2、
//var swf_id_f = '${technologyArticle.copy_id}'; <pre name="code" class="java"> var swf_id_f =a1;
//我後臺傳過來的其中一個的div的id,貌似沒什麼用【廢話】,
//但我不知道怎麼用的時候才繫結id
//在下面有這句程式碼,可能這才是關鍵
// /**重新繫結id**/
// clip.glue(button_id);
//以上的可以是廢話
var clip = null;//ZeroClipboard.Client物件
//指定ZeroClipboard.swf位置
var swfroot = '${root}';//${root}是我在頁面表示我專案根目錄的,你用的webstom的話這個請寫你自己的目錄。
ZeroClipboard.setMoviePath(swfroot + "/assets/admin/ZeroClipboard/ZeroClipboard.swf");//這個必須寫
$(function () { clip = new ZeroClipboard.Client();//建立ZeroClipboard.Client物件 clip.setHandCursor(true);//滑鼠移動到元素上之後顯示手型
//繫結元素
clip.glue(swf_id_f); //複製完成後的監聽事件 clip.addEventListener('complete', function () { //獲取最新的賦值 clip.setText($('#' + swf_id_f)[0].innerText); //模態框顯示xmp保持html資料的內容完整 $('#myModaljianqie').html("<xmp>" + $('#' + swf_id_f)[0].innerText + "</xmp>"); //模態框彈出 $('#myModal').modal('show') /**複製一次後,hide()使複製按鈕失效,防止重複計算使用次數**/ /**如果mouseover事件中新繫結id,此處就可以不使用了**/ /*clip.hide();*/ /* alert('複製成功,內容為:' + clip.clipText);*/ }); $("pre .hljs").mouseover(function () { var button_id = $(this).parent().attr('id');//複製div的id swf_id_f = button_id; /**重新繫結id**/ clip.glue(button_id); clip.setText($(this).parent()[0].innerText); /**複製繫結的box;;clip.reposition(button_id);**/ }); });
------------
---
-
有問題再問,謝謝。