您正在使用IPV4(35.168.110.128)访问本站 您本次共访问本站 1 次
 用户名: 密 码: 验证码:     用QQ登录本站
首页 软件 编程 笑话 知识 公告 台风 日历 计算器
[公益]文明驾车我带头,文明行路我带头,礼貌让座我带头      

【腾讯云】多款云产品1折起,买云服务器送免费机器,最长免费续3个月      
[公益] 节省一分零钱 献出一份爱心 温暖世间真情      
2022年 中秋节 21
2022年 国庆节 42
2023年 元 旦 134
2023年 春 节 155
 
本类新增
本类热门文章
您现在的位置:首页 >> 脚本程序 >> 内容
JavaScript实现一键复制内容剪贴板
内容摘要: !DOCTYPEhtmlhtmlheadtitle一键复制demo/titlemetacharset='utf-8'metaname='viewport'content='width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0,viewport-fit=cover'styl......
<!DOCTYPEhtml>

<html>

<head>

<title>一键复制demo</title>

<metacharset="utf-8">

<metaname="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0,viewport-fit=cover">

<styletype="text/css">

*{

padding:0;

margin:0;

}

h2{

text-align:center;

margin-top:20px;

}

#neirong{

width:calc(90%-20px);

padding:10px10px;

margin:20pxauto;

background:#eee;

border-radius:5px;

}

#copy{

border:none;

width:90%;

height:45px;

background:#39f;

font-size:16px;

color:#fff;

font-weight:bold;

border-radius:5px;

margin:0auto;

display:block;

}

</style>

</head>

<body>

<h2>一键复制demo</h2>

<divid="neirong">这是内容这是内容这是内容这是内容</div>

<buttonid="copy">复制</button>

<script>

functioncopyArticle(event){

constrange=document.createRange();

range.selectNode(document.getElementById('neirong'));

constselection=window.getSelection();

if(selection.rangeCount>0)selection.removeAllRanges();

selection.addRange(range);

document.execCommand('copy');

alert("复制成功");

}

window.onload=function(){

varobt=document.getElementById("copy");

obt.addEventListener('click',copyArticle,false);

}

</script>

</body>

</html>

上一篇:js实现列表自动滚动循环播放 下一篇:使用CSS实现六边形的图片效果
发布日期:2022/7/26
手机扫二维码直达本页
发布时间:15:05:19
点击:93
录入:壹家怡园
相关文章
Baidu

YiJiaCMS 6.3.1.220701(MSSQL) 闽ICP备05000814号-1
本空间由腾讯云(轻量应用服务器)提供,百度云加速提供加速防护
Copyright©2000-2022