Jquery表格多行復制粘貼是一個非常方便的功能,它可以讓我們在表格中進行大量數據的復制和粘貼操作。在這篇文章中,我們將介紹如何使用Jquery來實現表格的多行復制粘貼。
//復制 $("#copy-btn").click(function() { var count = 0; var selected = new Array(); $("table tbody tr").each(function() { if ($(this).hasClass("selected")) { count++; selected.push($(this)); } }); if (count > 0) { //檢查是否是連續的行 var isContinuous = true; for (var i = 0; i < selected.length - 1; i++) { if (selected[i + 1].index() - selected[i].index() != 1) { isContinuous = false; break; } } if (isContinuous) { var clipboardData = ""; for (var i = 0; i < selected.length; i++) { selected[i].find("td").each(function() { clipboardData += $(this).text() + "\t"; }); clipboardData += "<br>"; //換行 } clipboardData = clipboardData.substr(0, clipboardData.length - 5); //去除最后一個換行 //將數據保存到剪貼板中 $("#clipboard").val(clipboardData).select(); document.execCommand("Copy"); alert("已復制" + count + "行數據!"); } else { alert("所選行不是連續的,請重新選取!"); } } else { alert("請選擇要復制的行!"); } }); //粘貼 $("#paste-btn").click(function() { var clipboardData = $("#clipboard").val(); if (clipboardData == "") { alert("請先復制數據后再進行粘貼操作!"); return false; } var rows = clipboardData.split("<br>"); var currentIndex = $(".selected").length == 0 ? 0 : $(".selected:last").index() + 1; for (var i = 0; i < rows.length; i++) { //添加新行 var newRow = $("table tbody tr:first").clone(); $("table tbody").append(newRow); //填充數據 var cols = rows[i].split("\t"); for (var j = 0; j < cols.length; j++) { newRow.find("td:eq(" + j + ")").text(cols[j]); } //選中新行 newRow.addClass("selected"); currentIndex++; } alert("已粘貼" + rows.length + "行數據!"); });
以上是Jquery表格多行復制粘貼的代碼實現,可以將代碼放到頁面中進行測試。通過這個功能,我們可以快速地復制和粘貼表格中的數據,提高工作效率。
上一篇jquery表單訂單