我想使用jquery将文本复制到剪贴板。但是我缺少的地方。我有以下代码:
<span class="copy-btn" data-type="attribute" data-attr-name="data-clipboard-text" data-model="couponCode" data-clipboard-text="<?php echo $result->coupon_code; ?>">COPY CODE</span>
</div>
而jquery如下:
$(document).ready(function(){
$('.copy-btn').on("click", function(){
value = $(this).data('clipboard-text'); //Upto this I am getting value
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(value).text()).select();
document.execCommand("copy");
$temp.remove();
})
})
所以请纠正我,如何将代码复制到剪贴板。我正在获取文本的值,但之后我无法继续。
您在此行上有一个错误:
$temp.val($(value).text()).select();
由于value
已经是一个字符串,因此您无需尝试将其作为输入字段获取。只需使用这个:
$temp.val(value).select();
这是一个工作示例。
var copyToClipboard = function (text) {
var $txt = $('<textarea />');
$txt.val(text).css({ width: "1px", height: "1px" }).appendTo('body');
$txt.select();
if (document.execCommand('copy')) {
$txt.remove();
}
};
html:
<button address="any text" class="btn btn-login copyToClipboard"><span> copy</span>
js文件:
$('.copyToClipboard').click(function () {
let str = $(this).attr('address');
const el = document.createElement('textarea');
el.value = str;
el.setAttribute('readonly', '');
el.style.position = 'absolute';
el.style.left = '-9999px';
document.body.appendChild(el);
el.select();
document.execCommand('copy');
document.body.removeChild(el);
})