ZeroClipboard 和JqueryUI_dialog 完美组合！
生活随笔
收集整理的這篇文章主要介紹了
ZeroClipboard 和JqueryUI_dialog 完美组合！
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
ZeroClipboard 和JqueryUI 都是好東西，這里就不細說了。
下面直接看效果圖和代碼：
?
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <link href="/script/ui-lightness/jquery-ui-1.8.20.custom.css" rel="stylesheet"> <style type="text/css"></style><script src="../src/javascript/ZeroClipboard.js" type="text/javascript"></script> <script src="/script/jquery-1.7.2.min.js"></script> <script src="/script/jquery-ui-1.8.20.custom.min.js"></script> </head> <body> <div id="dialog"><input type="text" id="clip_txt" value="被復制的內容！" /> </div> <script type="text/javascript"> $(function () {ZeroClipboard.setMoviePath('../ZeroClipboard.swf');var clip = new ZeroClipboard.Client();clip.setHandCursor(true); // 鼠標手形 $('#dialog').dialog({dialogClass: 'clip_dialog', // 為dialog設置一個class，用于選取其中的按鈕 title: 'dialog_ZeroClipboard',buttons: {"復制": function () {}, // 復制按鈕"取消": function () {$('#dialog').dialog('close');}}, dragStop: function(event,ui){clip.reposition();},resizeStop: function(event,ui){clip.reposition();},open: function (event, ui) { // 對話框打開時if ($('#clip_btn').length > 0) return;$('.clip_dialog .ui-button-text:eq(0)').attr('id', 'clip_btn'); // 給復制按鈕加一個ID，為clip選取容器用，注意當有多個按鈕的時候要用“:eq(x)”選取其中的一個，x從0開始，0表示第一個 $('#clip_btn').css('position', 'relative'); // 拉出clip到頂層（被dialog覆蓋），也可將js中的“zIndex:99”改為“zIndex:2001”，但不推薦使用 $('#clip_btn').css('z-index', 2000);clip.glue('clip_btn'); // clip按鈕容器 clip.setText($('#clip_txt').val()); // 要復制的文本 clip.addEventListener('onComplete', function (client, text) { // 復制成功時的操作 alert('成功復制“' + text + '”到剪貼板');});$('#clip_txt').keyup(function () { // 當要復制的文本內容更改時更新clip中的內容 clip.setText($(this).val());}); /* */}}); }); </script> <input type="button" value="打開" onclick="$('#dialog').dialog('open')" /> </body> </html>?
?
轉載于:https://www.cnblogs.com/psamd/archive/2012/12/08/2809099.html
總結
以上是生活随笔為你收集整理的ZeroClipboard 和JqueryUI_dialog 完美组合！的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 发光二极管原理，理解，相关计算
- 下一篇： hibernate一级缓存和二级缓存的区