JS 点击复制按钮 将文字复制到手机剪贴板

我们在制作移动端网页的时候,经常会遇到这样一个问题,如何点击一个“复制”按钮,把一串文字复制到手机剪贴板,如上图所示。
看了网上的一些方法后,感觉那些方法都太复杂,有点要用插件,有的需要安装flash,但是这些对于手机等移动设备都不太合适,那么有没有一个简单点的办法呢?
今天,我们就来介绍一个简单实用的好方法:
①首先,我们把需要复制的部分 做成一个readonly的input,
②复制按钮的id 我这里设置成:js-copy-text,
③js如下:
<script>
$("#js-copy-text").click(function () {
var text = $(this).prev();//就是要复制的那个input
text.select();
document.execCommand('copy', false);
});
</script>
这样,当我们点击复制按钮的时候,就能将需要的文字复制下来啦~~~
复制或引用请注明出处哦~~
JS 点击复制按钮 将文字复制到手机剪贴板的更多相关文章
- 用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客
body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...
- PHP——0128练习相关2——js点击button按钮跳转到另一个新页面
js点击button按钮跳转到另一个新页面 投稿:whsnow 字体:[增加 减小] 类型:转载 时间:2014-10-10我要评论 点击按钮怎么跳转到另外一个页面呢?点击图片要跳转到新的页面时,怎么 ...
- js点击button按钮跳转到页面代码
点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick=&q ...
- js点击button按钮跳转到另一个新页面
点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick=&q ...
- js点击重置按钮重置表单
<html><head><script type="text/javascript">function formReset(){document ...
- js点击修改按钮后修改
<button id="click">改变内容</button> <div id="t">要改变的内容</div> ...
- js 点击复制文字
复制input里面的文字 html: <input id="content" class="form-control" type="text&q ...
- js 点击复制内容
<textarea id="pushUrlsTxt" rows="5" cols="55"></textarea> ...
- JS 点击复制Copy (share)
分享自:http://www.cnblogs.com/athens/archive/2013/01/16/2862981.html 1.实现点击按钮,复制文本框中的的内容 1 <script t ...
随机推荐
- ClickHouse 快速入门
ClickHouse 是什么 ClickHouse 是一个开源的面向联机分析处理(OLAP, On-Line Analytical Processing) 的列式存储数据库管理系统. 在一个 &quo ...
- js小数处理
js中的小数处理 先说说Math的几个方法: 1.Math.floor(x) 返回不大于当前数的最大整数. 我的记法:floor 直译 地板 也就是不大于的的意思 (x-0.5 四舍五入取整 ...
- Github--账号重新申请与配置
2017-04-24 最近洗心革面痛下决心要好好再深入学习一番前端,正好加入了一个外包团队接了份单子,外包项目正在如火如荼地进行着,自己也打算趁这个机会来好好学习总结一番. 但是俗话说得好," ...
- nginx源码分析——configure脚本
源码:nginx 1.13.0-release 一.前言 在分析源码时,经常可以看到类似 #if (NGX_PCRE) .... #endif 这样的代码段,这样的设计可以在不改动源码的 ...
- 分别用css3、JS实现图片简单的无缝轮播功效
本文主要介绍分别使用CSS3.JS实现图片简单无缝轮播功效: 一.使用CSS3实现:利用animation属性 (实现一张一张的轮播,肉眼只看见一张图片) HTML部分比较简单,两个div下包着几个i ...
- dubbox的provider端嵌套调用问题
今天遇到了一个问题,查了半天...,情况是这样的,我用的是dubbox,想做一个精简的全链路跟踪,一个消费者通过dubbox调用一个Service, service 里另外调用了两个service: ...
- 如何将angular-ui的分页组件封装成一个指令
准备工作: (1)一如既往的我还是使用了requireJS进行js代码的编译 (2)必须引入angualrJS , ui-bootstrap-tpls-1.3.2.js , bootstrap.css ...
- django无法加载admin的静态内容的问题(Centos7+Nginx+uwsgi环境下)
Nginx静态资源无法加载,导致admin没有CSS样式: 这个问题,主要是要理解: 1.Django不会去解析静态内容(css,js,img)等,而是交给Nginx去处理,所以nginx.conf要 ...
- ubuntu16.04 编译运行 LSD-SLAM
下载编译LSDSLAM,可能会出现 CreateGlutWindowAndWind is not a member of pangolin 以及 该函数参数报错的问题: 原因是在新的pangolin版 ...
- Power Pivot表属性无法切换回表预览模式的问题
近期Office365用户升级后解决了在Power Pivot中输入中文的问题,但是同时也带来了一个新的问题就是表属性窗口默认为“查询编辑器”模式,且无法切换回“表预览”模式. 本文和您分享在这种情况 ...