浏览器原生剪贴板 navigator.clipboard

写入 navigator.clipboard.writeText

navigator.clipboard.writeText('Linr Text to be copied')
.then(() => {
console.log('Text copied to clipboard');
})
.catch(err => {
// This can happen if the user denies clipboard permissions:
console.error('Could not copy text: ', err);
});

读取 navigator.clipboard.readText

navigator.clipboard.readText()
.then(text => {
console.log('Pasted content: ', text);
})
.catch(err => {
console.error('Failed to read clipboard contents: ', err);
});
document.addEventListener('paste', event => {
event.preventDefault();
navigator.clipboard.getText().then(text => {
console.log('Pasted text: ', text);
});
});

原文:https://developers.google.com/web/updates/2018/03/clipboardapi

navigator.clipboard 浏览器原生剪贴板的更多相关文章

  1. Javascript复制内容到剪贴板,解决navigator.clipboard Cannot read property 'writeText' of undefined

    起因 最近帮同事实现了一个小功能--复制文本到剪贴板,主要参考了前端大神阮一峰的博客,根据 navigator.clipboard 返回的 Clipboard 对象的方法 writeText() 写文 ...

  2. 原来浏览器原生支持JS Base64编码解码 outside of the Latin1 range

    原来浏览器原生支持JS Base64编码解码 « 张鑫旭-鑫空间-鑫生活 https://www.zhangxinxu.com/wordpress/2018/08/js-base64-atob-bto ...

  3. 通过浏览器navigator判断浏览器版本或者手机类型&&判断微信访问

    javascript 的navigator属性,不常用,但是用处也不少,主要用处是在做浏览器兼容的问题的时候,现在有的网站已经不兼容IE6,用户假如用IE6浏览网页的话,会提示浏览器升级等信息.或者判 ...

  4. navigator.userAgent浏览器检测(前端基础系列)

    对于前端来说,浏览器检测已经不陌生了,在做一些页面是,需要针对不同的浏览器进行处理不同的逻辑,最简单的就是区分pc和移动端的浏览器,或是android 和ios下的浏览器. 一.浏览器检测的由来?  ...

  5. JavaScript Window Navigator 浏览器本身的信息

    window.navigator 对象包含有关访问者浏览器的信息. Window Navigator window.navigator 对象在编写时可不使用 window 这个前缀. Navigato ...

  6. navigator(浏览器对象)Screen对象(屏幕)

    浅谈navigator对象: 注意:不是所有浏览器都支持 .cookieEnabled  判断是否启用了cookie  在客户端硬盘持久保存用户私密数据的小文件 .plugins 浏览器安装的所有插件 ...

  7. 现代浏览器原生js获取id号方法

    <div id="tests" class="a b c" style="color:#f00">123</div> ...

  8. 纯css解决div隐藏浏览器原生滚动条,但保留鼠标滚动效果的问题

    当我们的内容超出了我们的div,往往会出现滚动条,影响美观.尤其是当我们在做一些导航菜单的时候.滚动条一出现就破坏了UI效果.  我们不希望出现滚动条,也不希望超出去的内容被放逐,就要保留鼠标滚动的效 ...

  9. 浏览器原生 form 表单POST 数据的两种方式

    我们在提交表单的时候,form表单参数中会有一个enctype的参数.enctype指定了HTTP请求的Content-Type. 常用有两种:application/x-www-form-urlen ...

随机推荐

  1. ROS-OPENCV

    前言:opencv是一个开源的跨平台计算机视觉库. 前提:1.已下载并编译了相关功能包集,如还未下载,可通过git下载:https://github.com/huchunxu/ros_explorin ...

  2. 基于Redis实现分布式应用限流--转

    原文地址:https://my.oschina.net/giegie/blog/1525931 摘要: 限流的目的是通过对并发访问/请求进行限速或者一个时间窗口内的的请求进行限速来保护系统,一旦达到限 ...

  3. vue2.0中关于active-class

    一.首先,active-class是什么, active-class是vue-router模块的router-link组件中的属性,用来做选中样式的切换: 相关可查阅文档:https://router ...

  4. 彻底解决降级安装失败无法彻底卸载应用bug

    彻底解决魅族手机无法彻底卸载应用bug使用Flyme系统的同学可能会遇到一个问题:卸载了某些软件(例如通过开发者模式调试安装的应用)后,实际这个应用还残留在系统,当你用低版本或者其他签名的apk覆盖安 ...

  5. 【工作细节记录】维护项目中前端JS组件丢失后,应如何维护开发之启发

    事因: 我所维护的项目为旧项目,接手项目后并没有什么开发文档留下,导致很多时候一出现问题就需要自己去研究整个过程. 项目中一直使用一个"$.download()"的方法进行文件下载 ...

  6. Unity 烘焙的2种方式

    游戏场景通常有许多光源,使用实时渲染会非常消耗性能,解决办法是烘焙,烘焙有2种方式. 1, 在3dmax等模型制作软件中对场景进行烘焙.将烘焙好的模型以及贴图导入到unity3d. 相对复杂但效果好 ...

  7. JS自定义功能函数实现动态添加网址参数修改网址参数值

    无论是前端开发还是后台设计,很多时候开发人员都需要获取当前或目标网址的相关信息.这个已有现成的内置对象属性可以直接调用了(下面是获取当前页面的参考代码) 复制代码 代码如下: <script t ...

  8. C# 基础复习 四 多线程

    单线程和多线程的区别     单线程:         只用主线程处理,如果一个操作在占用主线程,那么其他操作则无法执行     多线程:         除了主线程外,还开启了子线程来执行操作,子线 ...

  9. CF482C Game with Strings (状压DP+期望DP)

    题目大意:甲和乙玩游戏,甲给出n(n<=50)个等长的字符串(len<=20),然后甲选出其中一个字符串,乙随机询问该字符串某一位的字符(不会重复询问一个位置),求乙能确定该串是哪个字符串 ...

  10. CORS与JSONP的区别

    CORS与JSONP: a. JSONP只能实现GET请求,而CORS支持所有类型的HTTP请求. b. 使用CORS,开发者可以使用普通的XMLHttpRequest发起请求和获得数据,比起JSON ...