实现网页端复制功能:

<div id="copyInput" style="display:none;">
  <form>
    <input id="pageUrlInput" type="text" class="form-control alert-input-url"
    style="border: 1px solid transparent; box-shadow: inset 0 0 0;" />
  </form>
</div>

<script>
//微课分享
var dLabel = document.getElementById("dLabel"); dLabel.addEventListener('click', function (event) {
var pageUrl = window.location.href;
var copyTextarea = document.getElementById("pageUrlInput");
copyTextarea.value = pageUrl; $("#shareSuccess").css({ "display": "" });
$("#copyInput").css({ "display": "" });
copyTextarea.select();
try {
var successful = document.execCommand('copy');
if (successful) {
document.getElementById('alert-share-text').innerText = "复制当前网页链接成功,现在您可以发送给朋友进行分享!";
} else {
document.getElementById('alert-share-text').innerText = "当前浏览器不允许访问剪切板,请复制当前网页链接发送给朋友进行分享!";
} setTimeout(function () {
$("#shareSuccess").css({ "display": "none" });
}, 3000) var msg = successful ? 'successful' : 'unsuccessful';
console.log('Copying text command was ' + msg); } catch (err) {
console.log('Oops, unable to copy');
}
});
</script>
}

js实现网页端复制功能的更多相关文章

  1. 网页端压缩解压缩插件JSZIP库的使用

    JSZIP这个库支持在网页端生成zip格式的文件,  官方网站是:http://stuk.github.io/jszip/ 官方网站的DEMO如下: <!DOCTYPE html> < ...

  2. 通过javascript在网页端生成zip压缩包并下载

    zip.js是什么 zip.js的github项目地址:http://gildas-lormeau.github.io/zip.js/ 通过zip.js封装一个能在网页端生成zip文件的插件, 直接在 ...

  3. 应用市场高速下载以及网页端调起APP页面研究与实现

    Github博文地址,此处更新可能不是很及时. 好久没写博客了,好大一个坑.正好,最近刚做完应用市场的高速下载功能,便拿来填了这个坑. 话说产品为了增加用户量,提升用户活跃度以及配合推广,更坑爹的是看 ...

  4. 网页端HTML使用MQTTJs订阅RabbitMQ数据

    最近在做一个公司的日志组件时有一个问题难住了我.今天问题终于解决了.由于在解决问题中,在网上也查了很多资料都没有一个完整的实例可以参考.所以本着无私分享的目的记录一下完整的解决过程和实例. 需求:做一 ...

  5. 分享基于 websocket 网页端聊天室

    博客地址:https://ainyi.com/67 有一个月没有写博客了,也是因为年前需求多.回家过春节的原因,现在返回北京的第二天,想想,应该也要分享技术专题的博客了!! 主题 基于 websock ...

  6. 应用市场快速下载以及网页端调起APP页面研究与实现

    Github博文地址,此处更新可能不是非常及时. 好久没写博客了,好大一个坑. 正好,近期刚做完应用市场的快速下载功能,便拿来填了这个坑. 话说产品为了添加用户量,提升用户活跃度以及配合推广,更坑爹的 ...

  7. 从Hybrid到React-Native: JS在移动端的南征北战史

    注:因为不了解Dart,所以本文不对flutter相关内容进行阐述, 实在抱歉 Hybrid Hybird是一种混合开发应用,可以实现JS和Java代码的互通,单纯使用ios/android原生实现, ...

  8. PHP防止被重复请求接口的方法(网页端签名验证的方法)

    PHP防止被重复请求接口的方法(网页端签名验证的方法) 可以采取签名验证的方式来 解决这个问题 1 time和随机数都是PHP生成的显示在前端 2 前端生成sign 3 进行每次请求的sign计数 这 ...

  9. 基于Vue.js PC桌面端弹出框组件|vue自定义弹层组件|vue模态框

    vue.js构建的轻量级PC网页端交互式弹层组件VLayer. 前段时间有分享过一个vue移动端弹窗组件,今天给大家分享一个最近开发的vue pc端弹出层组件. VLayer 一款集Alert.Dia ...

随机推荐

  1. kb-01-e<取余操作,宽搜,巧妙>;

    题目描述: n属于1到200,找到对应的一个数只含有0和1,并且是n的倍数: 分析: 本题有几个数会是大数:所以要考虑大数: 用到余数的性质:例如n=6,1%6=1: 1*10%6=4:       ...

  2. ie,360浏览器出现无法打开网页(包括本地html)的解决方法

    有一天,编写网页照例打开chrome,ie,360等浏览器,发现ie,360均无法打开本地网页,输入百度,也无法打开,从没遇到过这种情况,通过百度,找了几种方法,没解决, 后来,看到有一种原因可能是浏 ...

  3. android 脱壳 之 dvmDexFileOpenPartial断点脱壳原理分析

    android 脱壳 之 dvmDexFileOpenPartial断点脱壳原理分析 导语: 笔者主要研究方向是网络通信协议的加密解密, 对应用程序加固脱壳技术很少研究, 脱壳壳经历更是经历少之甚少. ...

  4. ecs01初始化node环境

    npm install 报错 > uglifyjs-webpack-plugin@ postinstall /opt/apps/iview-admin/node_modules/webpack/ ...

  5. Java-二叉树-插入、删除、遍历

    二叉树的具体特性和细节知识点,自行百度,直接上代码. 节点:节点内容.左子孩子.右子孩子.父亲 class Node { private int data; private Node leftChil ...

  6. css选择器浅谈

    css选择器有很多,种类的话总结起来有5种.即: id选择器,class选择器,elements选择器,级联选择器,相邻选择器. 前三个没什么好说的,分别是id,class和标签的选择,注意选中对象的 ...

  7. 内核的bootmem内存分配器【转】

    转自:http://blog.csdn.net/zmxiangde_88/article/details/8041040 版权声明:本文为博主原创文章,未经博主允许不得转载. 在内核启动期间,伙伴系统 ...

  8. 使用 IntelliJ IDEA 开发 Android 应用程序时配置 Allatori 进行代码混淆

    IntelliJ IDEA 提供了非常强大的 Android 开发支持,就连 Google 官方推荐的 Android Studio 其实也是 IntelliJ IDEA 的一个 Android 开发 ...

  9. vue生命周期回调方法

    最近在用vue开发一个商品列表页,因需要根据请求回的字段是否有内容来显示隐藏该字段, 但因为vue异步加载导致显示隐藏方法不起作业(主要是判断条件取不到页面渲染内容),围观了vue生命周期后发现upd ...

  10. [转载][FPGA]有限状态机FSM学习笔记(二)

    1. Mealy和Moore状态机的互换 对于给定的时序逻辑功能,可以用Mealy机实现,也可以用Moore机实现.根据Moore机比Mealy机输出落后一个周期的特性,可以实现两种状态机之间的转换. ...