有人能帮我写这个脚本吗。为什么要提交此表单，而不是在表上添加新行？如果我删除表单标记和提交按钮，那么添加和删除行就很好了。
<html>
<head>
<script src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
<script>
document).ready(function() {
var id = 0;
// Add button functionality
$("table.dynatable button.add").click(function() {
id++;
var master = $(this).parents("table.dynatable");
// Get a new row based on the prototype row
var prot = master.find(".prototype").clone();
prot.attr("class", "")
prot.find(".id").attr("value", id);
master.find("tbody").append(prot);
});
// Remove button functionality
$("table.dynatable input.remove").live("click", function() {
$(this).parents("tr").remove();
});
});
</script>
<style>
.dynatable {
border: solid 1px #000;
border-collapse: collapse;
}
.dynatable th,
.dynatable td {
border: solid 0px #000;
padding: 2px 10px;
width: 170px;
text-align: center;
}
.dynatable .prototype {
display:none;
}
</style>
</head>
<body>
<FORM name="save_event_personal" method="post" action="fetchrequest.php">
<table class="dynatable">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Start</th>
<th>Ende</th>
<th><button class="add">Add</button></th>
</tr>
</thead>
<tbody>
<tr class="prototype">
<td><input type="text" name="id[]" value="0" class="id" /></td>
<td><input type="text" name="name[]" value="" /></td>
<td><SELECT name="start[]">
<OPTION value="10:00">10:00</OPTION>
<OPTION value="11:00">11:00</OPTION>
<OPTION value="12:00">12:00</OPTION>
<OPTION value="13:00">13:00</OPTION>
<OPTION value="14:00">14:00</OPTION>
</SELECT></td>
<td><SELECT name="end[]">
<OPTION value="10:00">10:00</OPTION>
<OPTION value="11:00">11:00</OPTION>
<OPTION value="12:00">12:00</OPTION>
<OPTION value="13:00">13:00</OPTION>
<OPTION value="14:00">14:00</OPTION>
</SELECT</td>
<td><input type="image" class="remove" src="delete.png" alt="hi"/>
</tr>
</table>
<BR /><INPUT type="submit" value="Sumbit this form to fetchrequest.php" />
</FORM></body>
</html>
尝试阻止按钮的默认操作，即提交表单：
$("table.dynatable button.add").click(function(e) {
...
e.preventDefault();
});
<input type="image">
默认提交表单，因此您需要在点击时防止默认行为：
$("table.dynatable input.remove").live("click", function( e ) {
e.preventDefault();
$(this).parents("tr").remove();
});
你的脚本顶部有一个错误：
document).ready(function() {
...
应该是
$(document).ready(function() {
...
添加行功能相同：
$("table.dynatable button.add").click(function( e ) {
e.preventDefault();
...
默认情况下，在Internet Explorer上，按钮是"提交按钮"。你应该这样修改你的按钮：
<th><button type="button" class="add">Add</button></th>
您也可以在click回调中返回false。
默认情况下，元素实际提交当前表单。
您可以添加type="button"来防止这种情况：
<button type="button" class="add">Add</button>