demo:复制粘贴功能
复制链接功能,也是为了方便用户一键“复制”,粘贴链接和文本到指定位置,在此,接着上一篇“demo:生成专属二维码link ”来记录一键“复制”的实现。
相关插件
<!--布局: 按钮 输入框-->
<a href="###" class="copylinkbtn" data-clipboard-target="#myLink">复制链接</a>
<input type="text" class = "copylink" id="myLink" value=""/><!--输入框必须要,页面没展示,就使用障眼法,定位定出去-->
<!--复制成功-->
<div class="prompt_box">
<span>复制链接成功!</span>
</div>
<!--引用相关js:-->
<script src="jquery.min.js"></script>
<script src="clipboard.min.js"></script>
js的使用
$(document).ready(function(){
var myCodeUrl = "https://home.cnblogs.com/u/missme-lina"
$('.copylink').val(myCodeUrl);
console.log($('.copylink').val());
copy();
//复制功能
function copy(){
var clipboard = new Clipboard('.copylinkbtn');
//提示复制成功
clipboard.on('success', function(e) {
$('.prompt_box').show();
setTimeout(function(){$(".prompt_box").hide();},2000);//2秒后执行该方法
e.clearSelection();
});
clipboard.on('error', function(e) {
alert('sorry,该浏览器暂不支持复制功能,请升级或选择其他浏览器后重试!')
});
}
});
实现效果

jquery.qrcode.js的API
请自己转载官方文档:https://clipboardjs.com/
demo:复制粘贴功能的更多相关文章
- Android EditText 取消复制粘贴功能,取消横向全屏编辑功能(一)
在做一些安全性的软件时候常常要考虑取消 EditText 上的复制粘贴功能以确保安全性.下面就记录了这个方法: 首先在API-11以下的版本很简单,只需要在Xml布局文件或者用代码把长按属性设置成fa ...
- 在CMD命令行和PowerShell中实现复制粘贴功能
在CMD命令行和PowerShell中实现复制粘贴功能 常常使用命令行或者PowerShell的朋友肯定会遇到这样的情况:粘贴文本非常easy,右键--选择粘贴就可以,可是想要复制命令 ...
- 仿复制粘贴功能,长按弹出tips的实现
方案分析: 方案一:监听长按事件弹出PopupWindow[可行,缺点布局是固定的,小语种下会出现菜单截断现象] 方案二:弹出ContextMenu[不可行,因为ContextMenu的菜单是上下排列 ...
- iOS开发之--复制粘贴功能
复制粘贴功能,代码如下: 1.复制功能 UIPasteboard *pasteboard = [UIPasteboard generalPasteboard]; pasteboard.string = ...
- Java io流完成复制粘贴功能
JAVA 中io字节输入输出流 完成复制粘贴功能: public static void main(String[] args) throws Exception{ // 创建输入流要读 ...
- js实现复制粘贴功能
在项目中使用到复制粘贴功能,虽然网上有很多大牛封装了很多的插件,但是还是想不去使用插件,就像自己来实现这个功能. 另一篇是禁止复制粘贴 前端er怎样操作剪切复制以及禁止复制+破解等 初步想法: 1. ...
- Vbox中unbuntu15.10与win10共享文件 及开启复制粘贴功能
学习linux,一直使用的是VMware虚拟机,虽然功能很强大,但总感觉页面切换很麻烦.所以转入Vbox的使用,下面介绍下unbuntu15.10与win10共享文件. 一 共享文件夹 步骤1:启动u ...
- Winform 使用热键功能实现Ctrl+C和Ctrl+V复制粘贴功能
当我们使用winform控件的时候,会发现这些控件(比如Label)不支持Ctrl+c 复制和Ctrl+v 快捷键复制粘贴功能,如果我们需要实现这个功能改怎么做呢? 1. 首先我们创建一个winfor ...
- .NET 实现复制粘贴功能
老是把自己当作珍珠,就时时有怕被埋没的痛苦.把自己当作泥土吧,让众人把你踩成一条道路. -----<泥土>鲁藜 .NET如何实现复制粘贴功能,具体代码如下: aspx文件: <div ...
- ubuntu18.04下取消中键复制粘贴功能
Q: armlinux开发,主机采用ubuntu18.04操作系统,使用过程中关于鼠标中键有如下操作现象, 操作: 1.选中文本, 2.将鼠标光标定位到要插入的位置 3.按下鼠标中键 现象:将自动复制 ...
随机推荐
- 背水一战 Windows 10 (83) - 用户和账号: 数据账号的添加和管理, OAuth 2.0 验证
[源码下载] 背水一战 Windows 10 (83) - 用户和账号: 数据账号的添加和管理, OAuth 2.0 验证 作者:webabcd 介绍背水一战 Windows 10 之 用户和账号 数 ...
- 【接口时序】4、SPI总线的原理与Verilog实现
一. 软件平台与硬件平台 软件平台: 1.操作系统:Windows-8.1 2.开发套件:ISE14.7 3.仿真工具:ModelSim-10.4-SE 硬件平台: 1. FPGA型号:Xilinx公 ...
- 选项卡--原生js
比较基础的一个特效,毕业设计要做一些记录,就把这些都记下来吧,万一用到的时候忘了呢 function changeTab() { let navs = document.getElementsByTa ...
- MyBatis核心接口和类
SqlSessionFactoryBuilder: SqlSessionFactoryBuilder负责构建SqlSessionFactory.它的最大特点是:用过即丢.一旦创建了SqlSession ...
- python中stack在实际中的简单应用之进制转换
计算机的世界是二进制的,而人类的世界是十进制的,当数学公式用计算机表达时,经常 要转换.这就用到了进制的转换. 首先,我们先了解一下二进制和十进制的发展历史: 二进制: 现代的二进制首先由大数学家莱布 ...
- linux下配置nginx反向代理例子
官方说明: 例子: 虚拟机ip:192.168.85.3,物理机VMware Network Adapter VMnet8 ip:192.168.85.1 1,准备tomcat 准备一tomcat, ...
- 工厂模式-Spring的InitializingBean实现
一.创建产品角色接口: package org.burning.sport.design.pattern.factorypattern.spring.factory; public interface ...
- 根据iPhone6设计稿动态计算rem值
rem 单位在做移动端的h5开发的时候是最经常使用的单位.为解决自适应的问题,我们需要动态的给文档的更节点添加font-size 值.使用mediaquery 可以解决这个问题,但是每一个文件都引用一 ...
- Hadoop项目实战-用户行为分析之应用概述(三)
1.概述 本课程的视频教程地址:<项目工程准备> 本节给大家分享的主题如下图所示: 下面我开始为大家分享今天的第三节的内容——<项目工程准备>,接下来开始分享今天的内容. 2. ...
- Django | Cookie 中文编码的问题
在Django中,向cookie写入中文字符后会报错:如向cookie中保存用户名,当用户名存在中文字符时: Traceback (most recent call last): File , in ...