JS 实现复制 HTML 表格单元格内容

JS 实现复制 HTML 表格单元格内容
  • <table>
  • <tr><td> 姓名:<span onclick="copyContent(this);" title=" 点击复制 "> 张 三 </span></td></tr>
  • <tr><td> 姓名:<span onclick="copyContent(this);" title=" 点击复制 "> 李 四 </span></td></tr>
  • </table>
  • <input id="copy_content" type="text" value="" style="position: absolute;top: 0;left: 0;opacity: 0;z-index: -10;"/>
  • <script type="text/javascript">
  • function copyContent(ElementObj){
  • // 获取点击的值
  • var clickContent = ElementObj.innerText;
  • // 获取要赋值的 input 的元素
  • var inputElement = document.getElementById("copy_content");
  • // 给 input 框赋值
  • inputElement.value = clickContent;
  • // 选中 input 框的内容
  • inputElement.select();
  • // 执行浏览器复制命令
  • document.execCommand("Copy");
  • // 提示已复制
  • alert(' 已复制 ');
  • }
  • </script>

select() 方法只对 <input> 和 <textarea> 有效,所以,要获取到点击的值,放到 input 标签中,再选中复制

手机扫描二维码访问

本文标题:《JS 实现复制 HTML 表格单元格内容》作者:极四维博客
原文链接:https://cway.top/post/920.html
特别注明外均为原创,转载请注明。

分享到微信

扫描二维码

可在微信查看或分享至朋友圈。

相关文章

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

«    2025年3月    »
12
3456789
10111213141516
17181920212223
24252627282930
31

搜索

控制面板

您好,欢迎到访网站!
  查看权限

最新留言

文章归档

  • 订阅本站的 RSS 2.0 新闻聚合