如何使用jQuery将行添加到表中？ [英] How do you append rows to a table using jQuery?
问题描述
您好我正在尝试使用jQuery将一行添加到表中，但它不起作用。
可能是什么原因？
以下是代码：
< HTML>
< head>
< script type =text / javascriptsrc =jquery.js>< / script>
< script type =text / javascript>
$（'a'）。click（function（）{
$（'＃myTable'）。childs（'tr'）。append（'< tr class =child><< ; td> blahblah< \ / td>< / tr>'）;
}）;
< / script>
< title>< / title>
< / head>
< body>
< a href =>连结< / a>
< table id =myTable>
< tbody>
< tr>
< td>
test
< / td>
< / tr>
< / tbody>
< / table>
< / body>
< / html>
我假设您想将此行添加到< tbody> 元素，并简单地在< table>上使用 append（） ; 会在< tbody> 之外插入< tr>
$ b
$（'a'）。click（function（）{
$（'＃myTable tbody '）.append（'< tr class =child>< td> blahblah< / td>< / tr>'）;
}）;
编辑：是完整的源代码，它确实有效：（请注意 $（document）.ready（function（）{}）; ，它之前不存在。 / b>
< html>
< head>
< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js>< / script>
< script type =text / javascript> ;
$（document）.ready（function（）{
$（'a'）。click（function（）{
$（'＃myTable tbody'）。append（'< ; tr class =child>< td> blahblah< / td>< / tr>'）;
}）;
}）;
< / script>
< title>< / title>
< / head>
< body>
< a href =javascript：void（0）;> Link< ; / a>
< table id =myTable>
< tbody>
< tr>
< td> test< / td>
< / tr>
< / tbody>
< / table>
< / body>
< / html>
Hi I was trying to add a row to a table using jQuery, but it is not working.
What might be the reason?
And, can I put in some value to the newly added row..?
Here is the code:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$('a').click(function() {
$('#myTable').childs('tr').append('<tr class="child"><td>blahblah<\/td></tr>');
});
</script>
<title></title>
</head>
<body>
<a href="">Link</a>
<table id="myTable">
<tbody>
<tr>
<td>
test
</td>
</tr>
</tbody>
</table>
</body>
</html>
I'm assuming you want to add this row to the <tbody> element, and simply using append() on the <table> will insert the <tr> outside the <tbody>, with perhaps undesirable results.
$('a').click(function() {
$('#myTable tbody').append('<tr class="child"><td>blahblah</td></tr>');
});
EDIT: Here is the complete source code, and it does indeed work: (Note the $(document).ready(function(){});, which was not present before.
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a').click(function() {
$('#myTable tbody').append('<tr class="child"><td>blahblah</td></tr>');
});
});
</script>
<title></title>
</head>
<body>
<a href="javascript:void(0);">Link</a>
<table id="myTable">
<tbody>
<tr>
<td>test</td>
</tr>
</tbody>
</table>
</body>
</html>
这篇关于如何使用jQuery将行添加到表中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
