首页 > 其他分享 >JS复制文本,兼容各种浏览器

JS复制文本,兼容各种浏览器

时间:2024-12-02 14:34:38浏览次数:6  
标签:document 浏览器 JS 兼容 resolve 复制 input txt domCopy

function copyText(txt: string) {
    return new Promise((resolve, reject) => {
        const domCopy = function () {
            const input = document.createElement('input');
            input.value = txt;
            input.style.position = "absolute";
            input.style.top = "-100px"
            document.body.appendChild(input)
            setTimeout(() => {
                input.select()
                let r = document.execCommand("copy");
                if (r) {
                    resolve("复制成功")
                } else {
                    reject("复制失败")
                }
                input.remove();
            }, 100)
        }
        if (navigator.clipboard) {
            navigator.clipboard.writeText(txt).then(resolve).catch(() => {
                domCopy()
            });
        } else {
            domCopy()
        }
    })

}

  

标签:document,浏览器,JS,兼容,resolve,复制,input,txt,domCopy
From: https://www.cnblogs.com/zzg1022/p/18581828

相关文章

  • 星云erp-手机版-echart兼容小程序方案
    本文基于移动版 配套星云erp-手机版众多拿到源码的同学反映以下问题问题 首页的曲线图标在H5下可用,但发布为微信小程序后空白解决方法:步骤一:复现问题原来是小程序下通过$refs获取不了canvas组件对象。(经查阅资料后发现小程序下ref方式获取组件对象需要自定......
  • 谷歌浏览器strict-origin-when-cross-origin 解决
    问题描述:将Vue前端部署到服务器的Nginx以后,浏览器访问资源时就会产生跨域问题,随后使用gateway做了网关配置。配置完成后使用谷歌浏览器访问资源时控制台报错strict-origin-when-cross-origin随后使用火狐浏览器访问资源时为200而直接在地址栏输入请求url也是200解决思路网站当前访......
  • 如何让js的filter方法支持大小写?
    JavaScript的filter方法本身并不直接支持忽略大小写的过滤。你需要在filter的回调函数中手动实现大小写不敏感的比较。以下几种方法可以实现:1.使用toLowerCase()或toUpperCase():这是最常见和最简单的方法。将要比较的字符串都转换为小写或大写,然后再进行比较。const......
  • axios为什么能在浏览器中环境运行又能在node中环境运行?
    Axios之所以能在浏览器和Node.js环境中运行,是因为它使用了不同的适配器(adapters)来发送HTTP请求。它能够根据运行环境自动切换适配器。在浏览器中:Axios使用XMLHttpRequest(XHR)对象发送请求。这是浏览器内置的API,用于与服务器进行通信。在Node.js中:Axios使用http或ht......
  • js如何检测当前页面是否以全屏模式显示?
    你可以使用JavaScript检测页面是否处于全屏模式,主要通过检查document.fullscreenElement(标准API)或特定厂商前缀的属性。以下是一个兼容多种浏览器的函数:functionisFullscreen(){return!!(document.fullscreenElement||//标准APIdocument.webkitFull......
  • 用js封装一个前端分页的库,说说你的思路
    classPagination{constructor(options){this.options=Object.assign({total:0,//总数据量pageSize:10,//每页显示数量currentPage:1,//当前页码showPages:5,//显示的页码数量container:null,//分页容器元素......
  • 电影售票管理系统|Java|SSM|JSP| 前后端分离
    【重要1⃣️】前后端源码+万字文档+部署文档            【包含内容】【一】项目提供非常完整的源码注释【二】相关技术栈文档【三】源码讲解视频                     【其它服务】【一】可以提供远程......
  • 分类算法学业警示管理系统|Java|SSM|JSP| 前后端分离
    【重要1⃣️】前后端源码+万字文档+部署文档            【包含内容】【一】项目提供非常完整的源码注释【二】相关技术栈文档【三】源码讲解视频                     【其它服务】【一】可以提供远程......
  • 用户在浏览器中禁用了js脚本时该怎么办?
    当用户在浏览器中禁用JavaScript时,前端开发人员需要采取措施确保网站仍然可用,或者至少提供一个优雅的降级方案。以下是一些策略:1.提供<noscript>内容:这是最基本也是最关键的一步。<noscript>标签内的内容只会在用户的浏览器禁用JavaScript或不支持JavaScript时显示。......
  • 使用js写一个时钟的程序
    <!DOCTYPEhtml><html><head><title>JavaScriptClock</title><style>body{font-family:sans-serif;display:flex;justify-content:center;align-items:center;min-height:100vh;background-......