使用jQuery将行添加到表的tbody

我试图添加行到表的tbody 。 但是我遇到了这个问题。 首先，所有事情发生的function被称为从HTML页面的下拉改变。 我创build了一个trstring，其中包含所有包含html元素，文本和其他内容的td 。 但是，当我试图将生成的行添加到表中使用：

$(newRowContent).appendTo("#tblEntAttributes tbody");

我遇到一个错误。 表的名字是tblEntAttributes ，我tblEntAttributes它添加到tbody 。

实际上发生了什么是jQuery是无法获得tblEntAttributes作为一个HTML元素。 但我可以使用documemt.getElementById("tblEntAttributes");来访问它documemt.getElementById("tblEntAttributes");

有什么办法，我可以通过添加行到表的tbody来实现这一点。 也许是绕道或者什么的。

以下是整个代码：

var newRowContent = "

" + displayName + "" + logicalName + "" + dataType + ""; $("#tblEntAttributes tbody").append(newRowContent);

有一件事我忘了提到的是写代码的函数实际上是ajax调用的成功callback函数。 我能够访问表使用document.getElementById("tblEntAttributes")但由于某种原因$(#tblEntAttributes)似乎并没有工作。

("#tblEntAttributes tbody")

需要是

($("#tblEntAttributes tbody")) 。

您没有select具有正确语法的元素

这是两个例子

$(newRowContent).appendTo($("#tblEntAttributes"));

和

$("#tblEntAttributes tbody").append(newRowContent);

用这个

$("#tblEntAttributes tbody").append(newRowContent);

我从来没有遇到过这样一个奇怪的问题！ OO

你知道问题是什么吗？ $不工作。 我尝试了像jQuery一样的jQuery("#tblEntAttributes tbody").append(newRowContent); 它就像一个魅力！

不知道为什么这个奇怪的问题发生！

正如@威胁说appendTo应该工作，如果不是那么你可以试试这个：

$("#tblEntAttributes tbody").append(newRowContent);

这是一个appendTo版本，使用您提到的html下拉菜单。 它在“更改”上插入另一行。

$('#dropdown').on( 'change', function(e) { $('#table').append('

COL1COL2'); });

举一个例子让你玩。 祝你好运！

用Lodash你可以创build一个模板，你可以这样做：

这里去了javascript：

var count = 1; window.addEventListener('load', function () { var compiledRow = _.template("

\" value=\"\">"); document.getElementById('test').addEventListener('click', function (e) { var ajaxData = { 'chkboxId': 'chkboxId-' + count, 'chkboxValue': 'chkboxValue-' + count, 'displayName': 'displayName-' + count, 'logicalName': 'logicalName-' + count, 'dataType': 'dataType-' + count }; var tableRowData = compiledRow(ajaxData); $("#tblEntAttributes tbody").append(tableRowData); count++; }); });

这是在jsbin中