400电话办理-优企网络运营www.m8j.cn
您的位置 首页 代码

JS实现点击复制微信号代码

何在网页上实现点击复制微信号功能?在我们做网络运营的时候总是希望别人能快速扫描添加我们的微信,成为好友。但是同时存在一个问题,别人在浏览器或者微信自带的“浏览器”查看内容的时候怎么记住我们的微信号呢?

如何在网页上实现点击复制微信号功能?在我们做网络运营的时候总是希望别人能快速扫描添加我们的微信,成为好友。但是同时存在一个问题,别人在浏览器或者微信自带的“浏览器”查看内容的时候怎么记住我们的微信号呢?

其实很简单,只需要一段代码就可以实现点击复制微信号。用户复制微信号后不用记微信号,只需要在添加好友界面粘贴微信号后添加即可。

下效果如下:

点击复制微信号码添加好友效果展示

展示效果,点击图片可查看效果

点击查看效果

需要用到的JS代码: <script>    
    $(document).ready(function(){       
        var clipboard = new Clipboard(‘#copy_btn’);    
        clipboard.on(‘success’, function(e) {    
            alert(“微信号复制成功”,1500); 
            window.location.href=’weixin://’;
            e.clearSelection();    
            console.log(e.clearSelection);    
        });    
    });    
</script>

HTML代码:

微信号:<span id=”target”>xyz2018</span>
<button class=”btn” data-clipboard-action=”copy” data-clipboard-target=”#target” id=”copy_btn”>    
    点击复制    
</button>   

同时需要引入两个JS文件,推荐使用百度的CDN引入文件。这连个文件一定要放在JS代码之前,不然是没有效果的哦!

1. <script src=”http://libs.baidu.com/jquery/1.9.0/jquery.js”></script>

2. <script src=”https://cdn.jsdelivr.net/clipboard.js/1.5.12/clipboard.min.js”></script> 

代码素材来源于网络整合,如有侵权,请联系我们删除!

部分来自网络或由网友投稿,不代表优企网络立场,转载请注明出处:https://www.m8j.cn/daima/1302.html
又拍云CDN加速广告位
优企网络运营

作者: 优企网络运营

分享使我快乐

发表评论

电子邮件地址不会被公开。 必填项已用*标注

联系我们

联系我们

15285597973

在线咨询: QQ交谈

邮箱: boss@m8j.cn

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

关注微博
返回顶部