Question

修改

$(document).ready(function(){

$("#add").click(function(){
var currentValue = parseInt($("#hide").val())+1;
$("#Recipe_table").append("<tr><td><input type='text' name='name[]'/></td><td><input type='text' name='quantity[]'/></td><td><input type='text' name='measure[]'/></td></tr>");
$("#hide").val(currentValue);});

$("#remove").click(function(){
var currentValue = parseInt($("#hide").val())-1;
if ($("table tr").length != 1) {
$('#Recipe_table tr:last').remove();}});

});

添加和删除有效。

我的问题是，我不想删除所有行或者最终删除我的标题，直到第一个没有表格为止。

其次，当我删除时，该值不会减少，我只是复制上面，因为它工作并添加隐藏字段的值。

另外，有没有更好的方法来设置值，上面的方法只是毫不犹豫地增加，例如。

另外，当我提交并退回一页时，我如何防止它不恢复原来的价值。

Answer 1

你必须关闭你的元素

<table id='table'>
<th colspan='3'> Table</th>
<tr>
    <td><input type='text' name='name1[]'/></td>
    <td><input type='text' name='name2[]'/></td>
    <td><input type='text' name='name3[]'/></td>
</tr>
</table>

Answer 2

关闭</td>代码

<table id='table'>
 <th colspan='3'> Table</th>
 <tr><td><input type='text' name='name1[]'/></td>
   <td><input type='text' name='name2[]'/></td>
   <td><input type='text' name='name3[]'/></td>
 </tr>

编辑：这也可行

<table id='table'>
<th colspan='3'> Table</th>
  <tr><td/><input type='text' name='name1[]'/>
    <td/><input type='text' name='name2[]'/>
    <td/><input type='text' name='name3[]'/>
  </tr>

Answer 3

您尚未关闭单元格或表格标签。这是更正后的html。我不得不假设你想要最终的输入标签......

<html>
    <body>
        <table id='table'>
           <th colspan='3'> Table</th>
           <tr>
              <td><input type='text' name='name1[]'/></td>
               <td><input type='text' name='name2[]'/></td>
               <td><input type='text' name='name3[]'/></td>
           </tr>
        </table>
        <input type='hidden' id='put int on how many rows added'/>
    </body>
</html>

Answer 4

这是一个如何动态添加行的示例

HTML

<table id='table'>
<th colspan='3'> Table</th>
<tr><td><input type='text' name='name1[]'/></td>
    <td><input type='text' name='name2[]'/></td>
    <td><input type='text' name='name3[]'/></td>
</tr>
</table>
<input type="button" id="btn" value="add"/>

脚本

 $(document).ready(function(){
    $("#btn").click(function(){
    $("#table").append(" <tr><td><input type='text' name='name1[]'/></td><td><input type='text' name='name2[]'/></td>        <td><input type='text' name='name3[]'/></td></tr>");
    });
    });

Demo

修改

<input type='hidden' id='hide'/> var currentValue= parseInt($("#hide").val())+1;; $("#hide").val(currentValue);

Answer 5

你看起来像HTML，CSS和JS（JQuery）的初学者，所以有一些规则。像这样构建你的代码：

<table id='table'>
    <th colspan='3'>Table</th>
    <tr>
         <td><input type='text' name='name1'/></td>
         <td><input type='text' name='name2'/></td>
         <td><input type='text' name='name3'/></td>
    </tr>
</table>
<input type='hidden' name="name4" value="The Text you Want to Store"/>

..但在有效使用JS之前，您仍需要学习HTML。使用JQuery可以使用以下方法获取表元素的值：

$('[name="name1"]').val();

并使用以下方法设置值：

$('[name="name1"]').val("NewValue");

查看有关HTML和JS帮助的网站w3schools.com和有关学习jquery的jquery.com

Answer 6

我不认为你计算<td>数量的解决方案是一个很好的解决方案，使用

numberOfTds = $("#table").children('tr').children('td').length;

Jquery向表中添加3个输入标记

6 个答案: