Question

单击输入“加”时，尝试添加此表的一行。

我的Html

<table name="mytable2" width="100px"  border="0" cellspacing="0" cellpadding="0" style="padding-top:5px">
    <tr class="st" name="st">
    <td width="80px" style="text-align:center; padding-top:3px;">
    <input type="Text" id="newst" name="newst" maxlength="25" style="width:80px; font-family:Tahoma; font-size:11px;"></td>
    <td width="20px">
    <input type="submit" name="plus" id="plus" value="+" style="width:20px; text-align:center;"></td>  
    </tr>
</table>

我正在使用的是什么：

<script type="text/javascript">
$(document).ready(function() {
    $("#plus").click(function() {
$('#mytable2 tbody>tr:last').clone(true).insertAfter('#mytable2 tbody>tr:last');
$('#mytable2 tbody>tr:last #st').val('');
    $('#mytable2 tbody>tr:last #newst').val('');
            $('#mytable2 tbody>tr:last #plus').val('+');
return false;
    });
});

有人可以帮忙吗？

Answer 1

id 不是名字：）

<table name="mytable2"


<table id="mytable2"

http://jsfiddle.net/brentmn/whgy6/

Answer 2

我想也许你已经陷入了尝试用几行代码完成它，并使用框架...以下将做你想要的，并且不需要任何库。如果您担心转移的字节，请编写清除代码并使用缩小器（例如

）缩小代码

http://developer.yahoo.com/yui/compressor/

这对我有用，而且可以启动：）

<html>
<head>
<title>foo</title>
<script type="text/javascript">
function insertAfter( referenceNode, newNode ) {
    referenceNode.parentNode.insertBefore( newNode, referenceNode.nextSibling );
}

function cloneRow(e) {

  // first find our row
  var elem = e;
  while ( elem.tagName != 'TR' ) {
    elem = elem.parentNode;
  }

  var newElem = elem.cloneNode(true);
  insertAfter(elem, newElem);
}
// ]]>
</script>
</head>
<body>
<table name="mytable2" width="100px"  border="0" cellspacing="0" cellpadding="0" style="padding-top:5px">
    <tr class="st" name="st">
    <td width="80px" style="text-align:center; padding-top:3px;">
    <input type="Text" id="newst" name="newst" maxlength="25" style="width:80px; font-family:Tahoma; font-size:11px;"></td>
    <td width="20px">
    <input type="submit" name="plus" id="plus" value="+" style="width:20px; text-align:center;" onclick="cloneRow(this)"></td>  
    </tr>
</table>
</body>
</html>

在信用到期的情况下，您可以看到我使用了来自另一个答案的插入技巧作为此答案的一部分......

.insertAfter or .append to an Element Id with Javascript. it's a script tag so it can't be with $

请注意，这依赖于在html中传入“this”。如果你用jQuery或其他东西附加它，你需要查看e.target等。

按钮上的添加行单击

2 个答案: