我有一個 HTML 表格，其中包含一個特定的列，我想通過按下按鈕將其復制到剪貼板。該列包含容器編號，我給它一個類“.container”
這是我到目前為止的代碼。HTML：
<button onclick="copyToClipboard('.container')">Copy container #s</button>
Javascript：
<script>
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
}
</script>
改編自這個問題，我所做的唯一改變是使它成為一個類選擇器而不是一個 ID 選擇器來獲取表格范圍：單擊按鈕復制到剪貼板使用 jQuery
當我單擊按鈕時，它會復制所有具有“.container”類的單元格的內容。挑戰在于它復制所有單元格內容而不在它們之間放置任何空格。理想情況下，我想在不同的單元格內容之間放置逗號、行空間或其他型別的分隔符。
我嘗試了不同的代碼變體，如下所示：
$("body" ", ").append($temp);
$("body").append($temp ", ");
$("body").append($temp).append(", ");
但這些都行不通。我有一種感覺，它不起作用的原因是 $temp 變數已經包含所有單元格內容的連接字串，因此此時進行任何字串拆分為時已晚。
因此，我認為改變需要發生在這條線上：
<button onclick="copyToClipboard('.container')">Copy container #s</button>
但我只是不確定如何修改它以便它在每個單元格上回圈，并在它們之間附加一個逗號。任何幫助表示贊賞
uj5u.com熱心網友回復：
為了與,你分開，你必須通過tds運行一個回圈。您可以映射所有 tds 文本并將其與,.
$(element).find('td').map(function(){
return $(this).text();
}).get();
請參閱下面的片段：
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
//Added below code;
var cellValues = $(element).find('td').map(function(){
return $(this).text();
}).get();
var allCellValues = cellValues.join(',');
//Added above code;
$temp.val(allCellValues).select();
document.execCommand("copy");
$temp.remove();
console.log(allCellValues);
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tr class="container"><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
</table>
<button onclick="copyToClipboard('.container')">Copy container #s</button>你也可以在這里測驗。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/319132.html
標籤：javascript html 查询