jq实现表格多行列复制
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
* {
margin: 20px;
padding: 20px;
}
</style>
</head>
<body>
<table border="1" cellpadding="0">
<tr>
<th>
<button id="copy">复制</button>
</th>
<th>B</th>
<th>C</th>
<th>D</th>
<th>E</th>
</tr>
<tr>
<td class="shuzi">aaaaaaaaaaaaaa</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td class="shuzi">bbbbbbbbbbbbb</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td class="shuzi">ccccccccccc</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td class="shuzi">dddd</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
</table>
</body>
<script src="jquery.min.js"></script>
<script type="text/javascript">
// 选中一列
content = "";
$("table tr td,table tr th").on("click", function () {
var index = $(this).index();
content = "";
Array.from($("table tr td")).forEach(item => {
if (item.cellIndex == index) {
content += item.innerHTML + "\n";
}
});
var flag = copyText(content);
alert(flag ? "复制成功!" : "复制失败!");
});
/*
$("#copy").click(function () {
var arr = $(".shuzi");
var content ="";
Array.from(arr).forEach(item => {
content += item.innerHTML+"\n";
});
var flag = copyText(content);
alert(flag ? "复制成功!" : "复制失败!");
});
*/
function copyText(text) {
var textarea = document.createElement("textarea");//创建input对象
var currentFocus = document.activeElement;//当前获得焦点的元素
document.body.appendChild(textarea);//添加元素
// 给表单赋值
textarea.value = text;
// 判断光标是否在第一位置
textarea.focus();
if (textarea.setSelectionRange)
textarea.setSelectionRange(0, textarea.value.length);//获取光标起始位置到结束位置
else
textarea.select();
try {
var flag = document.execCommand("copy");//执行复制
} catch (eo) {
var flag = false;
}
document.body.removeChild(textarea);//删除元素
currentFocus.focus();
return flag;
}
</script>
</html>
jq实现表格多行列复制的更多相关文章
- [jQuery编程挑战]007 切换数据表格的行列
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...
- js动态创建表格,删除行列的小例子
js动态创建表格,删除行列的实例代码. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...
- Java 操作Word表格——创建嵌套表格、添加/复制表格行或列、设置表格是否禁止跨页断行
本文将对如何在Java程序中操作Word表格作进一步介绍.操作要点包括 如何在Word中创建嵌套表格. 对已有表格添加行或者列 复制已有表格中的指定行或者列 对跨页的表格可设置是否禁止跨页断行 创建表 ...
- 关于excel表格中只复制筛选后的数据
今天笔者在整个一个表格中的数据,需要将原表格的数据根据一些条件筛选后,整理到新的excel表中 但是发现每次操作,都将筛选条件之外的数据也粘贴进去了,但笔者确实又只选中了部分数据 经过多种方式尝试后, ...
- JQ完成表格单元格顺序的上移下调
如有指教及疑问,欢迎留言 HTML代码 <table class="exampletable"> <thead> <tr> <th> ...
- 示例-创建表格-指定行列&删除表格的行和列
<body> <script type="text/javascript"> /* *上面的方法和你麻烦. *既然操作的是表格, *那么最方便的方式就是使用 ...
- jQuery学习(四)——使用JQ完成表格隔行换色
1.步骤分析: 第一步:引入jquery的类库 第二步:直接写页面加载函数 第三步:直接使用jquery的选择器(组合选择)拿到需要操作的元素(奇数行和偶数行) 第四步:分别使用CSS的方法(css( ...
- element ui + sortablejs实现表格的行列拖拽
<template> <div class="container"> <el-table :data="tableData" bo ...
- JQ 实施编辑 (clone()复制行||双击编辑)
//代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...
随机推荐
- [转载]jsp上传文件
JSP 可以与 HTML form 标签一起使用,来允许用户上传文件到服务器.上传的文件可以是文本文件或图像文件或任何文档. 本章节我们使用 Servlet 来处理文件上传,使用到的文件有: uplo ...
- 【ABAP系列】SAP ABAP7.40新语法简介第一篇
公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[ABAP系列]SAP ABAP7.40新语法简 ...
- 换根dp特征总结
Rt,大概总结一下吧(不时更新一小下 1.一般都没有指定根,刚开始随便选一个根(1号点工具人) 2.两次$dfs$,一次从工具人开始预处理一些东西,第二次(也是从工具人开始)换根. 3.多用于:只要确 ...
- 【VS开发】使用WinPcap编程(3)——设置过滤器
设置过滤器要用到两个函数,一个是pcap_compile(),另一个是pcao_setfilter().他们的函数原型如下所示: int pcap_compile (pcap_t *p, struct ...
- IDEA 对spring boot Maven 项目打 Jar 包
<build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> ...
- 交换机安全学习笔记 第六章 IPV4 ARP攻击
ARP欺骗攻击 常用工具: dsniff(Linux/windows).ettercap(Linux/windows).cain(仅windows). ARP欺骗攻击的目的是嗅探发往某主机的所有IP ...
- Spring(二)--Spring入门案例
Spring入门案例 1.需要的实体类 2.需要的接口和实现类 3.需要的service和实现类 /** * service层的作用 * 在不改变dao层代码的前提下,增加业务逻辑操作 */ publ ...
- spring aop之父子容器
需求;项目对外提供接口,要求每个对外接口都要进行token认证. 解决办法:写一个token认证的工具类,在每个需要认证的接口方法开始的地方,调用工具类中的token认证方法. 问题:因为要满足指定条 ...
- springboot笔记之helloworld
开发工具:IDEA 2019 springboot版本:2.1.9 一.springboot2.x VS 1.x 基础环境升级 最低 JDK 8,支持 JDK 9,不再支持 Java 6 和 7 依赖 ...
- 【6.10校内test】 noip模拟
题目链接: p1 FBI树 p2 医院设置 p3 加分二叉树 | | | | | | 分 界 线 | | | | | | 应该算是一篇反思博. 对于OI,我真的算不上是热爱(当然不热爱不代表就不 ...