我们在制作移动端网页的时候,经常会遇到这样一个问题,如何点击一个“复制”按钮,把一串文字复制到手机剪贴板,如上图所示。

  看了网上的一些方法后,感觉那些方法都太复杂,有点要用插件,有的需要安装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 点击复制按钮 将文字复制到手机剪贴板的更多相关文章

  1. 用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客

    body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...

  2. PHP——0128练习相关2——js点击button按钮跳转到另一个新页面

    js点击button按钮跳转到另一个新页面 投稿:whsnow 字体:[增加 减小] 类型:转载 时间:2014-10-10我要评论 点击按钮怎么跳转到另外一个页面呢?点击图片要跳转到新的页面时,怎么 ...

  3. js点击button按钮跳转到页面代码

    点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick=&q ...

  4. js点击button按钮跳转到另一个新页面

    点击按钮怎么跳转到另外一个页面呢?我们在网站制作中可能是需要的,因为有时我们需要做这样的效果,尤其是将按钮做成一个图片,而点击图片要跳转到新的页面时,怎么做到呢? 这样的效果可以:onclick=&q ...

  5. js点击重置按钮重置表单

    <html><head><script type="text/javascript">function formReset(){document ...

  6. js点击修改按钮后修改

    <button id="click">改变内容</button> <div id="t">要改变的内容</div> ...

  7. js 点击复制文字

    复制input里面的文字 html: <input id="content" class="form-control" type="text&q ...

  8. js 点击复制内容

    <textarea id="pushUrlsTxt" rows="5" cols="55"></textarea> ...

  9. JS 点击复制Copy (share)

    分享自:http://www.cnblogs.com/athens/archive/2013/01/16/2862981.html 1.实现点击按钮,复制文本框中的的内容 1 <script t ...

随机推荐

  1. Java程序i学习中各阶段的建议

    第一部分:对于尚未做过Java工作的同学,包括一些在校生以及刚准备转行Java的同学. 一.Java基础 首先去找一个Java的基础教程学一下,这里可以推荐一个地址,或者你也可以参照这个地址上去找相应 ...

  2. easyUI中datagrid的使用

    easyUI中的datagrid数据表格经常被用到,结合项目中的使用情况,总结一下datagrid使用中需要注意的一些问题.使用datagrid展示数据,需要在html.css.js中都要编写代码,h ...

  3. 迁移 SQL Server 到 Azure SQL 实战

    最近有个维护的项目需要把 SQL Server 2012 的数据库迁移到 Azure SQL 上去.主要是因为租用的主机到期,而运营商停止了主机租赁业务,看来向云端的迁移是大势所趋啊!经过一番折腾最终 ...

  4. 蓝桥杯-奇怪的分式-java

    /* (程序头部注释开始) * 程序的版权和版本声明部分 * Copyright (c) 2016, 广州科技贸易职业学院信息工程系学生 * All rights reserved. * 文件名称: ...

  5. CSS之定位布局(position,定位布局技巧)

    css之定位 1.什么是定位:css中的position属性,position有四个值:absolute/relative/fixed/static(绝对/相对/固定/静态(默认))通过定位属性可以设 ...

  6. redis数据库入门

    Redis入门(1) 之安装.配置.安全登录 REmote DIctionary Server(Redis) 是一个由Salvatore Sanfilippo写的key-value存储系统. Redi ...

  7. .Net程序员学用Oracle系列(23):视图理论、物化视图

    1.视图理论 1.1.视图的存储 1.2.视图的作用 1.3.视图的工作机制 1.4.视图的依赖性 1.5.可更新的连接视图 1.6.内联视图 2.物化视图 2.1.刷新物化视图 2.2.物化视图日志 ...

  8. Mac电脑使用Android Studio进行真机调试

    第一步: 为mac电脑配置 adb 命令的环境变量,分为2小步 1.找到 Android Studio 为你安装的 SDK : 打开电脑中 Android studio 的工具的软件,在启动 Andr ...

  9. C#集合之并发集合

    .NET 4 开始,在System.Collection.Concurrent中提供了几个线程安全的集合类.线程安全的集合可防止多个线程以相互冲突的方式访问集合. 为了对集合进行线程安全的访问,定义了 ...

  10. POJ3252-Round Numbers 数学

    题目链接:http://poj.org/problem?id=3252 题目大意: 输入两个十进制正整数a和b,求闭区间 [a ,b] 内有多少个Round number 所谓的Round Numbe ...