一旦用户单击添加按钮,然后应该添加新的<tr>
和<td>
元素,我想做的事情就非常简单。问题是新添加的元素会立即消失。我已经检查过here。但是无关紧要
我认为代码段是不言自明的
$(document).ready(function() {
var i = 1;
$('#submit').click(function() {
i++
$('#data').append('<tr id="row' + i + '"><td><input type="text" name="name[]" id="name"></td><td><input type="submit" name="remove" id="' + i + '" class="btn btn-danger btn-xs btnRemove" value="x"></td></tr>');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="addName" method="post" name="addName">
<table id="data">
<tr>
<td><input id="name" name="name[]" type="text">
</td>
<td><input class="btn btn-success btn-xs btnAdd" id="submit" type="submit" value="+">
</td>
</tr>
</table>
<input class="btn btn-info btn-xs" id="submit" name="submit" type="button" value="Submit">
</form>
答案 0 :(得分:1)
您需要使用.preventDefault();
:
$('#submit').click(function(e){
e.preventDefault();
i++
$('#data').append('<tr id="row'+i+'"><td><input type="text" name="name[]" id="name"></td><td><input type="submit" name="remove" id="'+i+'" class="btn btn-danger btn-xs btnRemove" value="x"></td></tr>');
});
否则,您的type=submit
按钮在单击时实际上会提交表单