js 实现一键复制功能

// html

    <textarea name="" id="" cols="30" rows="10"></textarea>
    <button>复制</button>

// js
$('button').click(e=>{
	$('textarea').select()
	document.execCommand("Copy")
})

变通一下使其能复制p / div / span中的内容
首先把textareaopacity设置为0 使其不可见。

<div class="layui-col-md12">
   <div class="layui-form-item layui-form-text" style="text-align: right;">
        <button id="copy" class="layui-btn layui-btn-sm">复制内容</button>
    </div>
    <pre id="viewColumn" class="layui-code"></pre>
    <textarea style="opacity: 0; height: 0;" id="_copy" cols="30" rows="1"></textarea>
</div>


// js
// 点击赋值, 
$("#run").click(e => {
    if ($('#textarea').val().trim() == '' || $('#textarea1').val().trim() == '') return false
    let fileds = createArr($('#textarea').val()),
        titles = createArr($('#textarea1').val())
    $('#viewColumn').html(createColumn(fileds, titles))
    $('#_copy').html(createColumn(fileds, titles))  // 同时给不可见的textarea赋值,
})
// 点击复制
$("#copy").click(e => {
// 如果没有在上边赋值, 也可以在这里赋值,先赋值,在选中,后复制
  $('#_copy').select()
  document.execCommand("Copy")
})

发布了40 篇原创文章 · 获赞 13 · 访问量 4万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 书香水墨 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览