表格内的forms
我在HTML表格中添加了一些表单来添加新行和更新当前行。 我得到的问题是，当我检查我的开发工具中的表单时，我发现表单元素在打开后立即closures（input等不包含在表单中）。
因此，提交表单不包括字段。
表格行和input如下：
<tr> <form method="post" action=""> <td> <input type="text" name="job_num"> </td> <td> <input type="text" name="desc"> </td> </form> </tr> 任何帮助将是伟大的，谢谢。
表单不允许是table ， tbody或tr的子元素。 试图放置一个会导致浏览器将表格移动到表格之后 （同时保留其内容 – 表格行，表格单元格，input等）。
你可以在一个表格中放置一个整个表格。 你可以在一个表格单元格中有一个表单。 你不能在表格中放置一部分表格。
在整个桌子周围使用一种forms。 然后使用点击提交button来确定哪一行要处理（快速）或每行处理（允许批量更新）。
使用“表单”属性 ，如果你想保存你的标记：
<form method="GET" id="my_form"></form> <table> <tr> <td> <input type="text" name="company" form="my_form" /> <button type="button" form="my_form">ok</button> </td> </tr> </table>
如果你想要一个“可编辑的网格”，也就是像结构这样的表格，允许你将任何一行作为一个表单，使用模仿TABLE标签布局的CSS： display:table ， display:table-row ， display:table-cell 。
无需将整个表格封装在一个表格中，也不需要为表格的每一个明显的行创build单独的表格和表格。
试试这个：
<style> DIV.table { display:table; } FORM.tr, DIV.tr { display:table-row; } SPAN.td { display:table-cell; } </style> ... <div class="table"> <form class="tr" method="post" action="blah.html"> <span class="td"><input type="text"/></span> <span class="td"><input type="text"/></span> </form> <div class="tr"> <span class="td">(cell data)</span> <span class="td">(cell data)</span> </div> ... </div>
将FORM封装在FORM中的问题是任何和所有的表单元素都会在提交时发送（也许这是所期望的，但可能不是）。 此方法允许您为每个“行”定义一个表单，并只发送提交的那一行数据。
围绕TR标签（或TR围绕FORM）包装FORM标签的问题是它是无效的HTML。 表格将仍然允许像往常一样提交，但在这一点上，DOM已经坏了。 注意：尝试使用JavaScript获取FORM或TR的子元素，可能会导致意外的结果。
请注意，IE7不支持这些CSS表格样式和IE8将需要一个DOCTYPE声明进入“标准”模式:(试试这个或其他东西等效）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
任何其他支持display：table，display：table-row和display：table-cell的浏览器都应该显示您的css数据表，就像使用TABLE，TR和TD标签一样。 他们中的大多数是。
请注意，您也可以通过将行组分别包装到另一个DIV中，使用display: table-header-group ， table-row-group和table-footer-group来模仿THEAD，TBODY，TFOOT。
注意：你不能用这个方法做的唯一的事是colspan。
看看这个插图： http : //jsfiddle.net/ZRQPP/
