JS实现复制功能


Posted in Javascript onMarch 01, 2017

效果图:

JS实现复制功能

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS复制功能</title>
<link href="" rel=" rel="external nofollow" stylesheet">
<style>
 *{
 margin:0;
 padding:0;
 }
 input{
 border:1px solid #ccc;
 padding: 5px;
 width: 200px;
 }
 button{
 height:32px;
 }
</style>
</head>
<body>
 <input type="text"placeholder="里面输入文字">
 <button type="button">点击复制</button>
 <script type="text/javascript" src='http://libs.baidu.com/jquery/2.0.0/jquery.js'></script>
 <script>
  $(document).ready(function(){
  $('button').click(function(){
  $('input').trigger('select');
  document.execCommand('copy');
  alert('复制成功')
  })
  })
 </script>
</body>
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
jQuery的.live()和.die() 使用介绍
Sep 10 Javascript
当前页禁止复制粘贴截屏代码小集
Jul 24 Javascript
javascript判断chrome浏览器的方法
Mar 26 Javascript
jQuery内部原理和实现方式浅析
Feb 03 Javascript
JavaScript运算符小结
Jun 03 Javascript
jQuery取消ajax请求的方法
Jun 09 Javascript
jQuery向父辈遍历的简单方法
Sep 18 Javascript
Chrome不支持showModalDialog模态对话框和无法返回returnValue问题的解决方法
Oct 30 Javascript
使用Vue如何写一个双向数据绑定(面试常见)
Apr 20 Javascript
小程序实现左滑删除功能
Oct 30 Javascript
js/jQuery实现全选效果
Jun 17 jQuery
vue + node如何通过一个Txt文件批量生成MP3并压缩成Zip
Jun 02 Javascript
node.js利用redis数据库缓存数据的方法
Mar 01 #Javascript
JS三目运算(三元运算)方法详解
Mar 01 #Javascript
vue-router 学习快速入门
Mar 01 #Javascript
浅谈regExp的test方法取得的值变化的原因及处理方法
Mar 01 #Javascript
Angular之指令Directive用法详解
Mar 01 #Javascript
js for循环倒序输出数组元素的实例
Mar 01 #Javascript
JSON与JS对象的区别与对比
Mar 01 #Javascript
You might like
php MYSQL 数据备份类
2009/06/19 PHP
php实现通过stomp协议连接ActiveMQ操作示例
2020/02/23 PHP
JavaScript 嵌套函数指向this对象错误的解决方法
2010/03/15 Javascript
js弹窗代码 可以指定弹出间隔
2010/07/03 Javascript
jquery获取复选框被选中的值
2014/03/22 Javascript
Node.js文件操作详解
2014/08/16 Javascript
jquery动态改变div宽度和高度
2015/02/09 Javascript
JavaScript模拟实现键盘打字效果
2015/06/29 Javascript
Avalon中文长字符截取、关键字符隐藏、自定义过滤器
2016/05/18 Javascript
JavaScript中的Object对象学习教程
2016/05/20 Javascript
基于jQuery实现点击列表加载更多效果
2016/05/31 Javascript
AngularJS Bootstrap详细介绍及实例代码
2016/07/28 Javascript
详解webpack-dev-server 设置反向代理解决跨域问题
2018/04/18 Javascript
React组件对子组件children进行加强的方法
2019/06/23 Javascript
深入了解query和params的使用区别
2019/06/24 Javascript
Python实现堆排序的方法详解
2016/05/03 Python
Python自定义函数定义,参数,调用代码解析
2017/12/27 Python
Python操作远程服务器 paramiko模块详细介绍
2019/08/07 Python
解决Python设置函数调用超时,进程卡住的问题
2019/08/08 Python
python使用turtle库绘制奥运五环
2020/02/24 Python
Python range与enumerate函数区别解析
2020/02/28 Python
python缩进长度是否统一
2020/08/02 Python
Sentry错误日志监控使用方法解析
2020/11/12 Python
html5+css3气泡组件的实现
2014/11/21 HTML / CSS
有750多个顶级品牌的瑞士时尚在线:ABOUT YOU
2017/01/04 全球购物
美国知名平价彩妆品牌:e.l.f. Cosmetics
2017/11/20 全球购物
面向对象编程是如何提高软件开发水平的
2014/05/06 面试题
施工资料员的岗位职责
2013/12/22 职场文书
环保建议书200字
2014/05/14 职场文书
公司租房协议书
2014/10/14 职场文书
教师先进个人材料
2014/12/17 职场文书
年底个人总结范文
2015/03/10 职场文书
2015年乡镇财政工作总结
2015/05/19 职场文书
JavaScript获取URL参数的方法分享
2022/04/07 Javascript
vue postcss-px2rem 自适应布局
2022/05/15 Vue.js
Redis基本数据类型String常用操作命令
2022/06/01 Redis