將表格單元格值複製到另一個單元格 - jQuery

我有一個簡單的HTML表格。我希望有一個按鈕，允許用戶將現有單元格的值複製到另一個單元格，例如點擊按鈕將值從1行/列3複製到第3行/列3將表格單元格值複製到另一個單元格 - jQuery

這裏有一個簡單的HTML表格：

http://jsfiddle.net/XF9BD/1/ 當用戶點擊「從最近的活動副本」的鏈接，它會將單元格3行中的值複製到同一列中。

2012-04-29 user982124

克隆值從選入新的細胞？ – Philip 2012-04-29 05:10:52

如果我理解正確，那麼認爲最簡單的方法是將所選的<tr>克隆插入表中，然後修改克隆。

HTML：

<table id="scores" width="358" border="1"> 
    <tbody id="recentActivities"> 
    <tr> 
    <td width="104">Recent Activity</td> 
    <td width="69">Result</td> 
    <td width="163"></td> 
    </tr> 
    <tr> 
    <td class="title">Activity 1</td> 
    <td class="result">100</td> 
    <td class="action_status"><button class="copy">Copy</button></td> 
    </tr> 
    <tr> 
    <td class="title">Activity 2</td> 
    <td class="result">300</td> 
    <td class="action_status"><button class="copy">Copy</button></td> 
    </tr> 
    <tr> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    </tr> 
    </tbody> 
    <tbody id="copiedActivities"></tbody> 
</table>

的JavaScript：

var $copiedActivities = $("#copiedActivities"); 
$("button.copy").on('click', function() { 
    var clone = $(this).closest("tr").clone(true).appendTo($copiedActivities); 
    var titleCell = clone.find(".title"); 
    titleCell.text('Projection' + titleCell.text()); 
    clone.find(".action_status").empty().text('Copy of Recent Activity'); 
});

見update of your fiddle

編輯：一些想法或者怎麼樣this？

來源

2012-04-29 08:27:51

感謝您的反饋。我需要隨時顯示目標行，因爲用戶可以直接輸入值，而不必按按鈕將其從前一行復制，因此我無法使用克隆方法。我終於在目標單元格中使用它： – user982124 2012-04-29 21:58:44

好吧，我現在明白了，我已經看到了答案，但最好在JavaScript中附加事件處理程序，而不是在HTML中。另外，稍微考慮一下，你應該能夠開發一個更優雅的「算法」解決方案 - 即。一個處理所有「複製...」按鈕的單個處理程序，它將從3行更高的位置獲取值，而不需要爲單元格提供單獨的ID。 – 2012-04-30 00:42:21

我最終使用在目標單元格下面，我需要這是可見的所有時間，並允許用戶手動輸入值，如果需要的話：

<td class="action"><button class="copy" onclick="$('#projectmodvalue').val($('#totalmod').val())" value="Set Value">Copy from Recent Activity</button></td>

來源

2012-04-29 22:01:55 user982124

將表格單元格值複製到另一個單元格 - jQuery

回答

相關問題