首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js 复制本文地址

在JavaScript中复制文本到剪贴板可以通过多种方式实现。以下是一个简单的方法,使用现代浏览器支持的navigator.clipboard.writeText API:

代码语言:txt
复制
function copyToClipboard(text) {
  if (navigator.clipboard && navigator.clipboard.writeText) {
    navigator.clipboard.writeText(text).then(function() {
      console.log('文本已成功复制到剪贴板');
    }).catch(function(err) {
      console.error('无法复制文本: ', err);
    });
  } else {
    // 兼容旧浏览器的方法
    var textArea = document.createElement("textarea");
    textArea.value = text;
    document.body.appendChild(textArea);
    textArea.focus();
    textArea.select();

    try {
      var successful = document.execCommand('copy');
      var msg = successful ? '成功复制到剪贴板' : '无法复制';
      console.log(msg);
    } catch (err) {
      console.error('无法复制文本: ', err);
    }

    document.body.removeChild(textArea);
  }
}

// 使用方法
copyToClipboard(window.location.href); // 复制当前页面的URL

这段代码首先检查navigator.clipboard.writeText是否存在,如果存在则使用这个API来复制文本。这个API是异步的,所以使用了.then().catch()来处理成功和失败的情况。

如果浏览器不支持navigator.clipboard.writeText,代码将回退到一个兼容旧浏览器的方法。这个方法创建了一个临时的textarea元素,将要复制的文本设置为其值,然后选择这个文本并执行浏览器的复制命令。最后,临时创建的textarea元素被移除。

请注意,出于安全考虑,大多数浏览器要求复制操作必须在用户的交互事件(如点击事件)中触发,否则可能会失败。

如果你想在网页上提供一个按钮让用户复制当前页面的URL,你可以这样做:

代码语言:txt
复制
<button onclick="copyPageUrl()">复制页面地址</button>

<script>
function copyPageUrl() {
  copyToClipboard(window.location.href);
}
</script>

在这个例子中,当用户点击按钮时,copyPageUrl函数会被调用,它又会调用前面定义的copyToClipboard函数,并传入当前页面的URL(window.location.href)。这样用户就可以轻松地复制页面地址到剪贴板了。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

没有搜到相关的沙龙

领券