javascript 拷贝文本
最近做了几个小网站,想在平时活动的论坛里面宣传一下,操作方式就是在留言时快速添加上自己的小广告。为了方便贴广告,写了一个油猴子脚本。
起先的设计是在页面中添加一个按钮,点击按钮自动将小广告插入到光标的后面。在写的过程中,发现activeElement会不断的变化,不易捕捉光标元素。想想就改成了,点击按钮,把小广告内容送到剪贴板里。
实现原理就是,在页面中放置一个textarea
元素,元素里放着小广告,按钮点击事件选择textarea
元素内容,送到剪贴板。
var copyTextareaBtn = document.querySelector('.js-textareacopybtn');
copyTextareaBtn.addEventListener('click', function(event) {
var copyTextarea = document.querySelector('.js-copytextarea');
copyTextarea.select();
try {
var successful = document.execCommand('copy');
var msg = successful ? 'successful' : 'unsuccessful';
console.log('Copying text command was ' + msg);
} catch (err) {
console.log('Oops, unable to copy');
}
});
参考资料
- How do I copy to the clipboard in JavaScript?
- document.execCommand
- How do I copy to the clipboard in JavaScript?
javascript 拷贝文本的更多相关文章
- javascript当文本框获得焦点设置边框
javascript当文本框获得焦点设置边框:本章节介绍一下当文本框获得焦点以后如何设置文本框的边框样式,本来是一个非常简单的问题,但是有可能前台美工人员对javascript并不是太了解,所以还是通 ...
- JavaScript 实现文本编辑器
JavaScript 实现文本编辑器 最近,我需要做一个非常基本的网页内容编辑功能.我不想使用 iframe ,我也不想要一个功能特别多的复杂编辑器,只需要很基本的内容编辑功能,例如粗体,斜体,列表, ...
- 10个免费的javascript富文本编辑器(jQuery and non-jQuery)
祝愿园子里的朋友圣诞节快乐. 本文介绍了10个免费易用富文本编辑器(rich text editors,RTE),其中5个是Jquery插件,另外5个是非Jquery富文本编辑器 简介 Javascr ...
- Javascript富文本编辑器
分享几款Javascript富文本编辑器 ueditor jqframework xheditor htmlbox kindeditor wymeditor jhtmlarea markitup ck ...
- javascript 在线文本编辑器
javascript 在线文本编辑器实现代码. 效果例如以下: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcGhwZmVuZ2h1bw==/font/5 ...
- Speech Recognition Grammar Specification Version 1.0 JavaScript TTS 文本发音
Speech Recognition Grammar Specification Version 1.0 https://www.w3.org/TR/speech-grammar/ W3C Recom ...
- 小伙伴们惊呆了!10行 JavaScript 实现文本编辑器
最近,我需要做一个非常基本的网页内容编辑功能.我不想使用 iframe ,我也不想要一个功能特别多的复杂编辑器,只需要很基本的内容编辑功能,例如粗体,斜体,列表,对齐等等. 您可能感兴趣的相关文章 分 ...
- JavaScript:文本域事件处理
文本域往往可以输入大量的文字信息,但是在文本域上有一些键盘的处理事件:onkeydown.onkeypress.onkeyup. 范例一:观察文本域的键盘事件处理 代码如下: 效果图如下: 默认状态: ...
- 利用javascript实现文本的自动输出
主要利用了setTimeout(),递归和String.substring(); 做出的效果就像是有一个打字员在打字. <!doctype html> <html lang=&quo ...
随机推荐
- JSP页面中的pageEncoding和contentType两种属性
关于JSP页面中的pageEncoding和contentType两种属性的区别: pageEncoding是jsp文件本身的编码 contentType的charset是指服务器发送给客户端时的内容 ...
- Z-XML团队 软件工程课之我感我思我收获
<软件工程>这门课像我们的诤友,不断督促我们前进,又不断指引我们收获.时间飞逝,我们Z-XML团队一个个完成了课程中的所有任务,一步步走到了期末年末. 走的远了,也该回头看看.全员7人回顾 ...
- eclipse提示信息设置和提示信息操作
1.提示信息设置 windows->preference->java->Editor->content Assist->Advance,选择需要提示的内容即可.如图所示: ...
- python 类访问控制
访问限制 我们可以给一个实例绑定很多属性,如果有些属性不希望被外部访问到怎么办? Python对属性权限的控制是通过属性名来实现的,如果一个属性由双下划线开头(__),该属性就无法被外部访问.看例子: ...
- synchronized的理解
用法解释 synchronized是Java中的关键字,是一种同步锁.它修饰的对象有以下几种: 1. 修饰一个代码块,被修饰的代码块称为同步语句块,其作用的范围是大括号{}括起来的代码,作用的对象是调 ...
- ural 1433. Diamonds
1433. Diamonds Time limit: 1.0 secondMemory limit: 64 MB Sasha is lucky to have a diamond in the for ...
- HTML head 头标签
HTML head 头部分的标签.元素有很多,涉及到浏览器对网页的渲染,SEO 等等,而各个浏览器内核以及各个国内浏览器厂商都有些自己的标签元素,这就造成了很多差异性.移动互联网时代,head 头部结 ...
- ubuntu 14.04 https 形式安装docker 私有库 harbor
起始目录/root,root 登陆后,直接在该目录进行下面的命令 下载harbor 预编译包 0.4.5 准备通过域名 reg.server.com 来访问镜像库所以需要在/etc/hosts 文件中 ...
- const 与指针
深入理解const char*p,char const*p,char *const p,const char **p,char const**p,char *const*p,char**const p ...
- dtd语法之定义属性
1.语法: <!ATTLIST 元素名称 属性名称 属性类型 默认值> 属性类型: l CDATA :文本数据 l (en1|en2|……) :属性值任选其一 l ID :属性值必须是唯 ...