分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

js/jquery常用方法------复制粘贴至剪切板

发布时间:2023-09-06 02:14责任编辑:林大明关键词:js

1.添加引用

<script src="/XX/XX/clipboard.min.js"></script>

(自己在网上下载)

2.复制按钮

<button class="btn btn-info" type="button" id="btnCopy" title="复制" data-clipboard-action="copy" data-clipboard-target="#ShortURL">
  复制
???????????????</button>

(加粗部分属性是必须的)

<table id="table_list"></table>

(此处我想操作复制的内容针对表格,这里的表格我用的jqgrid)

3.复制内容承载的文本域

<textarea id="ShortURL" name="ShortURL" placeholder="" readonly="" style="width:1px;height:1px;position:absolute;top:0;left:-100px;"></textarea>

4.jquery部分

var clipboard = new Clipboard(‘#btnCopy‘);
???????clipboard.on(‘success‘, function () {
???????????  parent.layer.alert("内容已复制到剪贴板!");
???????});
???????clipboard.on(‘error‘, function () {
???????????  parent.layer.alert("XXX!");
???????});

???????$("#btnCopy").click(function () {
???????????  var value = [];
???????????  var data = JucheapGrid.GetAllSelected("table_list");
???????????  for (var i = 0; i < data.Data.length; i++) {
???????????????    var id = data.Data[i];
???????????????    var d = $(‘#table_list‘).jqGrid("getRowData", id);
???????????????    value.push(d.Title);
???????????????    value.push(d.Content);
???????????  }
???????????  var text = value.join("\n");
???????????  $("#ShortURL").val(text);
???????});

(内容的话可以根据自己需要写,我这里主要是针对表格)

js/jquery常用方法------复制粘贴至剪切板

原文地址:https://www.cnblogs.com/LiCoco/p/9641925.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved