2

为什么第 3 行之后的插入不起作用？
还有其他我应该使用的方法吗？

<html>
<head>
    <title>Table Add Row</title>

<script type="text/javascript" src="../jquery.js"></script>
<script language="JavaScript">

    $("document").ready(function() {
        //alert("document ready");

        $("#EditComp tr:first").after('<tr><td>This row added after first</td></tr>');
        $("#EditComp tr:last").after('<tr><td>This row added after last</td></tr>');

        $('#EdRow3 tr').after('<tr><td>This row added after 3</td></tr>');

    });
</script>
</head>
<body>
    <table id="EditComp">
        <tbody>
            <tr id="EdRow1"><td>Row 1</td></tr>
            <tr id="EdRow2"><td>Row 2</td></tr>
            <tr id="EdRow3"><td>Row 3</td></tr>
            <tr id="EdRow4"><td>Row 4</td></tr>
            <tr id="EdRow5"><td>Row 5</td></tr>
        </tbody>
    </table>
</body>
</html>

为什么第 3 行之后的插入不起作用？
还有其他我应该使用的方法吗？

4

4 回答 4

2

只需在您的 JavaScript 代码中删除 #EdRow3 之后的 tr 即可。检查以下代码..

<html>
<head>
    <title>Table Add Row</title>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script language="JavaScript">

    $("document").ready(function() {
        //alert("document ready");

        $("#EditComp tr:first").after('<tr><td>This row added after first</td></tr>');
        $("#EditComp tr:last").after('<tr><td>This row added after last</td></tr>');

        $('#EdRow3').after('<tr><td>This row added after 3</td></tr>');

    });
</script>
</head>
<body>
    <table id="EditComp">
        <tbody>
            <tr id="EdRow1"><td>Row 1</td></tr>
            <tr id="EdRow2"><td>Row 2</td></tr>
            <tr id="EdRow3"><td>Row 3</td></tr>
            <tr id="EdRow4"><td>Row 4</td></tr>
            <tr id="EdRow5"><td>Row 5</td></tr>
        </tbody>
    </table>
</body>
</html>
于 2013-10-31T17:54:23.103 回答
1

$('#EdRow3 tr')应该是$('#EdRow3')。

你的选择trs 是 s 的后代#EdRow3。

$('tr#EdRow3')也可以，但是tr没有必要，因为 elementid是唯一的。

于 2013-10-31T17:48:07.477 回答
0

改变这个

$('#EdRow3 tr').after('<tr><td>This row added after 3</td></tr>');

对此

$('tr#EdRow3').after('<tr><td>This row added after 3</td></tr>');
于 2013-10-31T17:48:36.413 回答
0

小提琴。

您的选择器不正确。

$('#EdRow3').after('<tr><td>This row added after 3</td></tr>');
于 2013-10-31T17:49:44.760 回答