關於clipboard.js複製圖片以及文本的隨筆

作了一個商場的複製文本以及圖片的功能，網上找到了clipboard.js,試了會發現有些圖片不能複製到後面嘗試了屢次，最後獲得的結果就是服務器的路徑不能過長（還有圖片地址容許複製處理）好比：javascript

一、https://img.alicdn.com/imgextra/i2/2378443470/TB2OzgWvNGYBuNjy0FnXXX5lpXa_!!2378443470.jpg（不行）；
二、/goodsimg/2018606/152826962440080876.jpg（可行）；css

具體文檔可去官方查看，下面附上我本身寫的代碼，急用的話可看下。

html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="layui/css/modules/layer/default/layer.css"/>
</head>
<body>
<span class="fq-copy">
複製
</span>

<span class="layui-layer-content" id="a1">
<img class='' src='/goodsimg/2018606/152826962440080876.jpg'>
<br/>描述文字~
</span>

<script src="js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
<script src="layer/layer.js" type="text/javascript" charset="utf-8"></script>
<script src="js/clipboard.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
function _copy(anniu,content){
var clipboard = new Clipboard(anniu, {
target: function(e) {
return document.querySelector(content);
}
});

clipboard.on('success', function(e) {
alert('複製成功！！');
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
e.clearSelection();
});

clipboard.on('error', function(e) {
alert('複製失敗!')
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
});
}
_copy('.fq-copy','.layui-layer-content');
</script>
</body>
</html>java

//jq過濾複製內容的方法jquery

$(function() { var clipboard = new Clipboard('#clickcopy',{ // 經過target指定要複印的節點
                target: function(trigger) { // var $foo = $(trigger).prev(".foo").clone();
                    
                        var $foo =$('.editbox').clone(); $(trigger).after($foo); var $imgs = $(trigger).next(".editbox").find("img") $imgs.each(function(){ $(this).after($(this).data("emoji")); $(this).remove(); }); return $(trigger).next(".editbox")[0]; } }); clipboard.on('success', function(e) { alert("成功"); $(e.trigger).next(".editbox").remove(); e.clearSelection(); }); clipboard.on('error', function(e) { alert("複製失敗!本產品只兼容到Chrome 42+、Firefox 41+、IE 9+、Opera 29+，請您換一個最新瀏覽器。") }); });