单击时复制文本字符串

2023-11-23

我希望能够在单击时复制文本字符串没有按钮。文本字符串将位于“span”类内。

  1. 用户将鼠标悬停在文本字符串上
  2. 用户单击文本字符串
  3. 文本字符串被复制到剪贴板

您可以附上copy事件至<span>元素、使用document.execCommand("copy")在事件处理程序中,设置event.clipboardData to span .textContent with .setData()的方法event.clipboardData

const span = document.querySelector("span");

span.onclick = function() {
  document.execCommand("copy");
}

span.addEventListener("copy", function(event) {
  event.preventDefault();
  if (event.clipboardData) {
    event.clipboardData.setData("text/plain", span.textContent);
    console.log(event.clipboardData.getData("text"))
  }
});
<span>text</span>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

单击时复制文本字符串 的相关文章

  • 如何检测浏览器是否支持自定义元素

    我正在查看 Modernizr 它应该有助于功能检测 这应该可以帮助确定您的网站是否与给定的 Web 浏览器兼容 但我没有看到任何表明我可以使用它来检测自定义 HTML 的内容我们在内容中创建和定义的元素 如果不是 Modernizr 我如
  • jquery.find() 可以只选择直接子项吗?

    我应该向 jQuery find 提供什么参数来选择元素子元素而不选择其他元素 我不能用 gt 引导选择器 而用 将选择所有后代 而不仅仅是直接子代 我知道 jQuery children 但这是一个库 因此用户能够提供自己的选择器 并且我
  • 如何重定向到 instagram://user?username={username}

    我的 html 页面上有这个链接 可以在特定用户上打开 Instagram 应用程序 a href Link to Instagram Profile a 我一直在寻找自动运行 url instagram user username USE
  • 使用 JavaScript 使链接保持活动状态并在单击时显示悬停效果

    I am struggling to make this work I d like to make it where if O F is clicked the hover state stays active if another li
  • 使用 jQuery/JS 打开时使
    标签的内容具有动画效果

    我只想要 HTML5 的内容details标记为 滑行 动画打开 而不是仅仅弹出打开 立即出现 这可以用 jQuery Javascript 实现吗 Fiddle http jsfiddle net 9h4Hq HTML
  • Node.js:如何在检索数据(块)时关闭响应/请求

    我正在用 node js 构建一个应用程序 它加载多个页面并分析内容 因为 node js 发送块 所以我可以分析这些块 如果一个块包含例如索引 nofollow 我想关闭该连接并继续其余部分 var host example com to
  • 从未用 @flow 标记的导入文件中获取类型定义

    TL DR我怎么告诉flow从未声明的导入模块导入类型定义 flow 加长版 流接缝能够从不使用流语法的文件中派生类型 请参阅示例 示例文件 flow js if Math random lt 0 5 var y hello else va
  • 为什么是 javascript:history.go(-1);无法在移动设备上工作?

    首先 一些背景 我有一个向用户呈现搜索页面 html 表单 的应用程序 填写标准并单击 搜索 按钮后 结果将显示在标准部分下方 在结果列表中 您可以通过单击将您带到新页面的链接来查看单个结果的详细信息 在详细信息页面中 我添加了一个 返回结
  • JavaScript 重定向到新窗口

    我有以下代码 它根据下拉列表的值重定向到页面 我如何使其在新窗口中打开 function goto form var index form select selectedIndex if form select options index
  • 表单计算器脚本基本价格未加载 OnLoad

    我的表单中有一个计算器来计算我的下拉选项选择 function select calculate on change calc input type checkbox calculate on click calc function cal
  • Babel 7 Jest Core JS“TypeError:wks不是函数”

    将我的项目升级到 Babel 7 后 通过 Jest 运行测试会抛出以下错误 测试在 Babel 6 中运行没有任何问题 但在 Babel 7 中失败并出现以下错误 TypeError wks is not a function at Ob
  • FireFox 中的自动滚动

    我的应用程序是实时聊天 我有一个 Div 来包装消息 每条消息都是一个 div 所以 在几条消息之后 我的 DOM 看起来像这样 div div Message number two div div div div
  • 如何在类似控制台的环境中运行 JavaScript?

    我正在尝试遵循这里的示例 http eloquentjavascript net chapter2 html http eloquentjavascript net chapter2 html and print blah 在浏览器中运行时
  • 有没有办法阻止 prettier / prettier-now 将函数参数分解为新行

    当使用 prettier prettier now 在保存时进行格式化时 当一个函数包装另一个函数时 它会中断到一个新行 我想知道是否有办法阻止这种行为 例如 期望的输出 app get campgrounds id catchAsync
  • 在 vue.js 中访问数组对象属性

    给定以下数组vue js packageMaps Object packageMap 0 Object Id 16 PackageType flag list ProductCode F BannerBase packageMap 1 Ob
  • Javascript转换时区问题

    我在转换当前时区的日期时间时遇到问题 我从服务器收到此日期字符串 格式为 2015 10 09T08 00 00 这是中部时间 但是当我使用 GMT 5 中的 new Date strDate 转换此日期时间时 它返回给我的信息如下 这是不
  • 如何更改此 jquery 插件的时区/时间戳?

    我正在使用这个名为 timeago 的插件 在这里找到 timeago yarp com 它工作得很好 只是它在似乎不同的时区运行 我住在美国东部 费城时区 当我将准确的 EST 时间放入 timeago 插件时 比如 2011 05 28
  • JQuery 图像上传不适用于未来的活动

    我希望我的用户可以通过帖子上传图像 因此 每个回复表单都有一个上传表单 用户可以通过单击上传按钮上传图像 然后单击提交来提交帖子 现在我的上传表单可以上传第一个回复的图像 但第二个回复的上传不起作用 我的提交过程 Ajax 在 php 提交
  • 如何在 pg-promise 中设置模式

    我正在搜索的文档pg 承诺 https github com vitaly t pg promise特别是在创建客户端时 但我无法找到设置连接中使用的默认架构的选项 它始终使用public架构 我该如何设置 通常 为数据库或角色设置默认架构
  • 导致回发到与弹出窗口不同的页面

    我有一个主页和一个详细信息页面 详细信息页面是从主页调用的 JavaScript 弹出窗口 当单击详细信息页面上的 保存 按钮时 我希望主页 刷新 是否有一种方法可以调用主页的回发 同时还可以从详细信息页面维护保存回发 Edit 使用win

随机推荐

  • 可以在 contenteditable div 中使用浏览器的撤消功能来撤消“range.insertNode”吗?

    我正在研究一个contenteditablediv 制作一个简单的富文本编辑器 我的要求之一是能够在按钮事件的光标位置插入 html 块 我能够通过使用使该部分正常工作range selection range insertNode nod
  • 反转表行

    我想反转表格正文行使用 jQuery 我拥有的 table width 630 border 0 cellspacing 0 cellpadding 0 thead tr td TITLE A td td TITLE B td 继续 jsf
  • 我可以处理 HTML

    我在 SO 和其他地方看到了很多关于右键单击事件以及如何使用 JavaScript 捕获和处理它们的问题和答案 通常使用 button的属性event浏览器生成的对象 然而 我还没有找到的一件事 可能是因为这是一个非常奇怪的请求 是如何捕获
  • “??”是什么意思?意思是?

    我正在查看 ASP NET MVC 1 0 生成的代码 并且想知道 双问号是什么意思 This constructor is not used by the MVC framework but is instead provided for
  • 在 C# 中使用 XML 文件存储数据

    我基本上是在寻找有人在这方面为我指明正确的方向 我阅读了一些 Microsoft 文档 但这并没有多大帮助 这是我第一次尝试使用 XML 我正在编写一个应用程序 需要存储已知用户的列表以及每个用户创建的别名列表 我已经弄清楚如何在应用程序关
  • Python Django ValueError:源代码字符串不能包含空字节

    我已经放下了一个我已经工作了几个月的 Django 项目 当我尝试重新运行服务器时 我收到了这个错误 ValueError source code string cannot contain null bytes 回溯是 C Users B
  • 在ios7中重新加载tableView标题

    如何在不重新加载所有表的情况下做到这一点 UIView tableView UITableView tableView viewForHeaderInSection NSInteger section UIView header if se
  • 无点风格并使用 $

    如何结合使用 和无点风格 一个明显的例子是下面的实用函数 times Int gt a gt a times n xs concat replicate n xs 只是写concat replicate产生错误 同样你不能写concat r
  • 在 Github 上获取 Travis Shield 以反映所选分支状态

    现在 无论我在 github 项目页面中选择哪个分支 我都可以让 travisshield 反映最新运行或特定分支 我可以通过在 URL 末尾省略或指定分支名称来完成此操作 相反 我想获得与所选分支相对应的盾牌 换句话说 每次我选择不同的分
  • 使用 javascript 取消注释 html 代码

    带有一些注释标签的 Html 表 我只是想取消注释这些标签 我尝试过使用 javascript 的正则表达式 但问题是它删除了整个注释行 因为我只是想取消注释这些标签 下面是带有注释标签的示例 html 表 table tr td ABCD
  • Angular2在第一次点击后删除点击事件绑定

    在我的应用程序中 我有一个甚至可以单击的按钮
  • 流星反应中的时刻?

    一直在使用https github com acreeger meteor moment在流星中 它工作得很好 但是有没有一种方法可以使时刻反应输出 以便它计数 3秒前 4秒前 等 我不会为每个单独的计时器使用新的会话变量 而是创建一个Tr
  • 如何识别并设置 Maven 中缺少的环境属性?

    我进行了构建设置 以便通过命令行传递变量 mvn clean install DsomeVariable data 在我的 pom 中我有
  • 如何在Python中将有符号整数转换为无符号整数

    假设我有这个号码i 6884376 我如何将其称为无符号变量 就像是 unsigned long i in C Assuming 你心里有 2 的补码表示 和 By unsigned long you mean无符号 32 位整数 那么你只
  • 如何为Web方法传递可选参数?

    我有一个带有多个参数的网络方法 web方法只依赖2个字段 其余都是可选的 OperationContract public string WarehouseContactInformation int WAID Required strin
  • (一般)从自定义数据类型构建解析器?

    我正在开发一个需要与服务器通信的网络流媒体客户端 服务器将响应编码为字节串 例如 1 NULJohn NULTeddy NUL501 NUL 其中 NUL 是分隔符 上面的响应翻译为 这是一条类型1的消息 由服务器硬编码 它告诉客户端用户的
  • 仅使用 sed 或 awk 从 html 页面提取 url 的最简单方法

    我想从 html 文件的锚标记中提取 URL 这需要在 BASH 中使用 SED AWK 来完成 请不要使用 Perl 做到这一点最简单的方法是什么 你也可以做这样的事情 前提是你安装了 lynx Lynx 版本 lynx dump lis
  • 理解 Java 字节

    因此 昨天在工作中 我必须编写一个应用程序来计算 AFP 文件中的页数 所以我重新整理了 MO DCA 规范 PDF 并找到了结构化字段BPG Begin Page 及其 3 字节标识符 该应用程序需要在 AIX 机器上运行 因此我决定用
  • Linux下获取缓冲区的物理地址

    我在具有完整 MMU 的 Xilinx Microblaze 上运行 Linux 内核 3 3 我正在执行的任务要求我了解以下内容 我需要创建一个文本文件 缓冲区 并找到该缓冲区的物理地址 并且我不希望内核将此文件写入不连续的内存区域 我需
  • 单击时复制文本字符串

    我希望能够在单击时复制文本字符串没有按钮 文本字符串将位于 span 类内 用户将鼠标悬停在文本字符串上 用户单击文本字符串 文本字符串被复制到剪贴板 您可以附上copy事件至 span 元素 使用document execCommand