做移动端的项目遇到一个需求要点击按钮复制dom里的内容，看了很多资料显示必须textarea或者input里的内容才能简单复制，还有就是用插件的了，最终都因为遇到各种问题放弃，最终选择了最简单的点击复制文本框(textarea)里的内容，把要复制的内容写在textarea里，用定位负值把文本框隐藏掉，然后就实现复制的功能了，贴一下简单的代码，共有需要的同学参考，欢迎大神指正。

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>

        <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">

        <title>点击按钮复制dom里的内容</title>

    </head>

    <body>

        <div>

            <div>我是要复制的内容1</div>

            <textarea cols="20" rows="10" id="copy1" style="position: fixed;top: -2000px;">我是要复制的内容1</textarea>

            <input type="button" onclick="copyContent('copy1')" value="复制1" /><br /><br />

            <div>我是要复制的内容2</div>

            <textarea cols="20" rows="10" id="copy2" style="position: fixed;top: -2000px;">我是要复制的内容2</textarea>

            <input type="button" onclick="copyContent('copy2')" value="复制2" /><br /><br />

            <div>我是要复制的内容3</div>

            <textarea cols="20" rows="10" id="copy3" style="position: fixed;top: -2000px;">我是要复制的内容3</textarea>

            <input type="button" onclick="copyContent('copy3')" value="复制3" /><br /><br />

        </div>

        <script src="../../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>

        <script type="text/javascript">

            function copyContent(id){

                var copyCon = document.getElementById(id);

                copyCon.select(); // 选择对象

                document.execCommand("Copy"); // 执行浏览器复制命令

                alert("已复制好，可贴粘。");

            }

        </script>

    </body>

</html>

jquery点击按钮复制内容的更多相关文章

  1. js 实现页面点击按钮复制内容

    前言: 我们平时在页面中是按照长按来实现复制相关的内容,那么怎么用js实现点击按钮实现复制相关的内容呢?请看如下方法: 实现步骤: 1.引入相关的js(ClipboardJS插件) <scrip ...

  2. js点击按钮复制内容到粘贴板

    复制内容到粘贴板,就是要选择需要复制的内容并执行document.execCommand("copy")命令: //复制内容到粘贴板 function copyToClipboar ...

  3. vue中点击按钮复制内容

    <el-button type="primary" round size="mini" @click="copyUrl">复制u ...

  4. JS实现PC、Android、IOS端的点击按钮复制内容功能

    直接上代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  5. iOS中点击按钮复制指定内容

    话不多说,直接上图和代码:

  6. 原生 js 实现点击按钮复制文本

    最近遇到一个需求,需要点击按钮,复制 <p> 标签中的文本到剪切板 之前做过复制输入框的内容,原以为差不多,结果发现根本行不通 尝试了各种办法,最后使了个障眼法,实现了下面的效果 一.原理 ...

  7. jquery点击按钮弹出图片

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  8. jquery( 点击按钮出来文本框并限制文本框的个数)

    // 首先呢  编辑这个文章  主要是用于和大家的交流  以便学习和交流!! <div class="form-group" id="spots"> ...

  9. jQuery 点击按钮刷新页面

    //页面加载时绑定按钮点击事件 $(function () { $("#按钮id").click(function () { refresh(); }); }); //点击按钮调用 ...

随机推荐

  1. js匿名函数使用&传参

    function () { alert("error"); } //报错:匿名函数不能直接调用 使用 0x01 (function () { alert("Success ...

  2. matlab练习程序（结构张量structure tensor）

    根据结构张量能区分图像的平坦区域.边缘区域与角点区域. 此算法也算是计算机科学最重要的32个算法之一了.链接的文章中此算法名称为Strukturtensor算法,不过我搜索了一下,Strukturte ...

  3. gamemakerstudio:room_speed和image_speed

    room_speed是游戏步数,每秒多少步(步事件)image_speed是动画帧率room_speed变则整个游戏变慢image_speed变只是该object动画变慢 除了游戏全局加速减速,一般不 ...

  4. win7+jdk1.6+solr4.7.2在内嵌jetty servelt或外置tocmat服务器的solr服务使用

        solr安装,目前初步接触solr,了解两种启动方式.一种是自带的jetty,另一种是基于tomcat.由于超过4.7.2版本的solr需要java1.7及以上版本的支持,所以我们选择solr ...

  5. tensorflow报错 Key Conv/biases not found in checkpoint

    可能的解决方法: 删除训练文件夹中的旧模型

  6. Win10提示“您未连接到nvidia gpu的显示器”的解决方法

    显卡有Nvidia 和 ATI两个芯片,我们经常称他们为N卡和A卡,N卡更加注重于性能,而A卡则为颜色艳丽,画面更好.不过,最近一些windows10系统用户在使用N卡过程中,遇到了提示“您当前未使用 ...

  7. CSS基础语法(二) CSS的9种选择器

    样式表的选择器 1.类选择器 根据HTML标签的class属性选择样式应用的属性 .类值{ … } 2.ID选择器 根据HTML标签的ID属性选择样式应用的元素 #id值{ … }  3.标签选择器 ...

  8. IOS 本地推送（UILocalNotification）

    推送通知 ● 注意:这里说的推送通知跟NSNotification有所区别 • NSNotification是抽象的,不可见的 • 推送通知是可见的(能用肉眼看到) ● iOS中提供了2种推送通知 ● ...

  9. Hibernate中一对多关联关系中的级联属性

    如果想通过级联属性删除一端的数据和多端的数据要使用 void org.hibernate.Session.delete(Object arg0) 方法. getSession().delete(tea ...

  10. javaw.exe 和java.exe的区别

    1.java启动的程序是命令行程序或阻塞程序,如果该程序未执行完毕或未被关闭,则所打开的命令行将被阻塞,不能执行其它命令如dir等,可以通过Ctrl+C等方式关闭程序:2.javaw启动的程序是窗口程 ...