从网上找了一个用ZeroClipboard的例子,在服务器上远程访问,可以使用,代码如下:
<script type="text/javascript" src='http:--code.jquery-com/jquery.js'></script> <script type="text/javascript" src="ZeroClipboard.js"></script> <script> $(function(){ //选中代码 $('.txt_code').click(function(){ $(this).select(); }); //设置swf路径 ZeroClipboard.setMoviePath("ZeroClipboard.swf"); //创建对象 var clip = new ZeroClipboard.Client(); //设置手型 clip.setHandCursor(true); //绑定按钮 clip.glue('btn_copy'); //复制内容 clip.addEventListener( "mouseOver", function(client) { client.setText($('.txt_code').val()); }); //复制成功后的提示 clip.addEventListener( "complete", function(){ alert("copyed successful"); }); }); </script> <textarea class='txt_code'>sssssssssss</textarea> <input type='button' value='copy' id='btn_copy' />
因为要用在一个页面有多个需要复制的地方,于是就把上述代码改了下,封装成一个函数。代码如下:
<script type="text/javascript" src='http:--code.jquery-com/jquery.js'></script> <script type="text/javascript" src="ZeroClipboard.js"></script> <script> function fcopy(){ // //选中代码 // $('.txt_code').click(function(){ // $(this).select(); // }); //设置swf路径 ZeroClipboard.setMoviePath("ZeroClipboard.swf"); //创建对象 var clip = new ZeroClipboard.Client(); //设置手型 clip.setHandCursor(true); //绑定按钮 clip.glue('btn_copy'); //复制内容 clip.addEventListener( "mouseOver", function(client) { client.setText($('.txt_code').val()); }); //复制成功后的提示 clip.addEventListener( "complete", function(){ alert("copyed successful"); }); } </script> <textarea class='txt_code'>sssssssssss</textarea> <input type='button' onclick="fcopy()" value='copy' id='btn_copy' />
这时候再运行,发现初次复制成功需要点击两次才可以,后面的一次点击就可以了。
谁知道这个怎么解决?又是因为什么原因呢?
页面打开后,第一次点复制不成功(这时ZeroClipboard.js,jquery)加载完成了吗 因为第一次点击执行了fcopy()后才绑定了zeroclipboard,所有只有下一次点击才会执行复制