我有一个动态创建的 html 表格。
以下 jQuery 代码捕获用户在该表中选择的 tr,并使用已选择的行中的特定数据填充另一个名为“selected_users”的表。
$('#available_users tbody').on('click', 'tr', function () {
var id = this.id;
var tr;
tr=$('<tr/>');
var index = $.inArray(id, selected);
if ( index === -1 ) {
selected.push( id );
var tds = $(this).find('td');
tr.append("<td>" + tds.eq(1).text() + "</td>");
tr.append("<td>" + tds.eq(3).text() + "</td>");
$('#selected_users').append(tr);
} else {
selected.splice( index, 1 );
}
$(this).toggleClass('selected');
} );
问题
这个逻辑是有效的。但是现在我需要做的是,当用户从 available_users 表中取消选择以前选择的记录时,我需要将其从“selected_users”表中删除。
到目前为止我尝试了什么:
我尝试做的第一件事是为 <TR>
分配一个 ID我在“selected_users”表中创建的,这样我就可以使用这个 id 来找到我想删除的行。
我试图将我的代码更改为如下所示:
var index = $.inArray(id, selected);
if ( index === -1 ) {
selected.push( id );
var tds = $(this).find('td');
tr.append("<td>" + tds.eq(1).text() + "</td>");
tr.append("<td>" + tds.eq(3).text() + "</td>");
tr.attr('id') = id.substring(4); //******* NEW ********
$('#selected_users').append(tr);
但它会报错“ReferenceError: invalid assignment left-hand side”。 另一个问题是如何从 selected_users 表中删除。我想把逻辑放在 else 路径中......
} else {
selected.splice( index, 1 );
//*** add logic to remove also from the selected_users table.
}
谢谢。
编辑 1
除了尝试将 ID 属性动态分配给新的 <TR>
之外,我在此处发布的所有代码均有效。我在补充。我认为在这种情况下,所有细节可能会使事情变得更加复杂???
如果我只是问如何做这样的事情,也许它会简化事情:
var tr;
tr.append("<td>value1</td>");
$('#test_table').append(tr);
当做类似上面的事情时,你如何将“id=123”的 id 分配给 <tr>
?
此外,如果您只有行 ID (<tr id=123>
),您如何从 test_table 中删除整行?
最佳答案
首先,我假设这是“bombs with an error ReferenceError: invalid assignment left-hand side
”的行:
tr.attr('id') = id.substring(4);
我做出这个假设是因为 attr('id')
将返回一个不可变的字符串,并且您正在尝试为该现有字符串分配一个新字符串(id.substring(4)
)。
如果您希望为 id
设置一个新值你需要使用 attr()
的 setter 形式方法:
tr.attr('id', id.substring(4))`
或者,假设子串取自当前的 id
:
tr.attr('id', function (index, currentProperyValue) {
return currentPropertyValue.substring(4);
});
上面的参数名称是用户定义的,第一个参数(上面:'index')是tr
中集合返回的当前元素的索引。多变的;第二个(上面:'currentPropertyValue')表示我们正在使用该方法更改的属性的当前值。
…if you only had the row id (
<tr id=123>
), how could you delete the entire row from test_table?
简单地说,使用 jQuery:
$('#123').remove();
这将从文档中删除该元素(无论该元素出现在文档中的什么位置,请记住重复的 id
是无效的,因此如果两个元素以相同的 id
出现,则只有 第一个元素id
将被删除)。
或者,但仍然很简单,使用纯 JavaScript;这里我们使用了一个变量,因为我们需要两次获取相同的元素:
var elem = document.getElementById('123');
elem.parentNode.removeChild(elem);
引用资料:
- JavaScript:
- >
document.getElementById()
. - >
Node.parentNode
. - >
Node.removeChild()
. - >
String
. - >
String.prototype.substring()
.
- >
- jQuery:
关于javascript - 如何通过 Jquery 动态删除表中的记录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30195695/