我想将所选对象从一个表克隆到另一个表。直到现在我正在获取要克隆的选定td的ID。以下是我正在尝试的代码。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<style type="text/css">
.row-highlight
{
background-color: Yellow;
}
</style>
<script type="text/javascript">
$(function() {
var message = $('#message');
var tr = $('#tbl,#tbl2').find('tr');
tr.bind('click', function(event) {
var values = '';
tr.removeClass('row-highlight');
var tds = $(this).addClass('row-highlight').find('td');
$.each(tds, function(index, item) {
values = item.id;
});
message.html(values);
});
});
</script>
</head>
<body>
<form>
<table>
<tr>
<td>
<table id="tbl" style="border: solid 1px black">
<tr>
<td id="a">
1
</td>
</tr>
<tr>
<td id="b">
2
</td>
</tr>
<tr>
<td id="c">
3
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td><input type="button"name="button one" value=">>" onclick=""</td>
</tr><tr>
<td><input type="button" name="button two" value="<<" onclick=""</td>
</tr>
</table>
</td>
<td>
<table id="tbl2" style="border: solid 1px black">
<tr>
<td>
</td>
</tr>
</table>
</td>
</tr>
</table>
<br />
<div id="message">
</div>
</form>
</body>
</html>
如何克隆和删除所选项目从表格“tbl”到“tbl2”按钮“按钮1”的点击功能,反之亦然点击按钮“按钮2”。 在此先感谢.////// p>
答案 0 :(得分:5)
只需使用,prepend(),append()方法。 这些方法将很好地满足您的目的。
你可以用这样的方式使用它:
var row = $(this).closest('tr').html();
$('#otherTable tbody').append('<tr>'+row+'</tr>');
答案 1 :(得分:1)
prepend()和append()函数应该可以解决问题。我在js中尝试过类似场景的另一件事是使用document.getElementById(tableIDA)首先获取相关表,然后使用tableA.insertRow(rowCountA)[其中rowCountA是表A的行数],后跟tableA.insertCell()函数,最后是cell.appendChild()。它似乎很长但实际上非常容易和程序化使用。可能这会有助于你的目的。
答案 2 :(得分:1)
如果遇到您的想法,则无需明确.clone()
。
通过直接使用.append()
,.appendTo()
,prepend()
或{{1>,您可以避免重建HTML中的元素(如果您没有使用事件委派,可能会失去任何事件处理程序) }}
伪码:
prependTo()
示例:
$A.appendTo($B);
// or
$B.append($A);
反过来也有效:
$('tr.highlighted').appendTo( $('#otherTable tbody') );