Question

我在HTML 5中有以下代码显示的表单。

<form name='removeTen' method='POST' action='notRemove.php'>
<table id='tender'>
<thead>
<tr><th></th>
<th><input id='selectAll' type='checkbox'></th>
<th>Notice Title</th>
<th>Edit </th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td><input type="checkbox" name="ten[]" value="1"</td>
<td>somedata1</td>
<td><input type = 'button' value = 'Edit' name ='1' ></td>
</tr>
<tr>
<td>2</td>
<td><input type="checkbox" name="ten[]" value="2"</td>
<td>somedata1</td>
<td><input type = 'button' value = 'Edit' name ='2' ></td>
</tr>
</tbody></table><p><input type=reset value='Reset'>
<input type=submit value='Submit'></p>
</form>

现在，当我点击按钮notEdit.php时，我想重定向到另一个页面Edit，其中包含按钮名称中包含的帖子数据。我还想使用submit按钮保留表单的功能。我添加了以下Javascript代码：

var buttons = document.getElementsByName("edit");
for(var i = 0, count = buttons.length; i<count; i++){
    buttons[i].attachEvent("click", submit);
}

现在在submit函数中，我可以添加window.location以重定向到另一个页面。但是如何附上帖子数据呢？

Answer 1

在点击处理程序功能中，从点击按钮的名称中获取行号。将此设置为另一个表单的输入字段，并在该表单上触发提交。

function submit(e){
    //get the clicked button's "name" attribute value.
    var row_no = e.currentTarget.name;
    alert(row_no);

    //set the value to the edit form
    var row_no_element = document.querySelector("input[name=row_no]");
    row_no_element.value = row_no;

    //submit the edit form. uncomment this line to submit.
    //document.getElementById("editForm").submit();
}

var buttons = document.querySelectorAll("input[type=button]");
for(var i = 0, count = buttons.length; i<count; i++){
    buttons[i].addEventListener("click", submit);
}

要提交以供编辑的新表单：

<form id="editForm" action='notEdit.php' method="POST">
    <input type="hidden" name="row_no" />
</form>

JSFiddle（带有html更正）：http://jsfiddle.net/xfLa3tnb/

Answer 2

<form name='actionForm' method='POST' action='actionEditOrRemove.php'>

使用隐藏输入传递操作（编辑或删除）。

按钮点击发送帖子数据，这不是使用Javascript的表单的提交按钮

2 个答案: