Javascript 迭代 - 保持相同的数字直到下一次运行

Question

我有以下 HTML

<form action="sendform.php" method="post" id="monogramming-builder">
  <fieldset>
    <table>
      <tr>
        <th>Qty</th>
        <th>Colour</th>
        <th>Size</th>
        <th>Name</th>
        <th>Remaining</th>
        <th>Remove</th>
      </tr>
      <tr>
        <td><input type="text" name="qty1" /></td>
        <td>
          <select name="colour1">
            <option value="">[Please Select]</option>
            <option value="Red">Red</option>
            <option value="Black">Black</option>
            <option value="White">White</option>
          </select>
        </td>
        <td>
          <select name="size1">
            <option value="">[Please Select]</option>
            <option value="Small">Small</option>
            <option value="Medium">Medium</option>
            <option value="Large">Large</option>
            <option value="XL">XL</option>
            <option value="2XL">2XL</option>
          </select>
        </td>
        <td><input type="text" name="name1" /></td>
        <td>18</td>
        <td><a href="javascript:;" class="remove">Remove Row</a></td>
      </tr>
    </table>
    <p><a href="javascript:;" class="addrow">Add a row</a></p>
  </fieldset>
</form>

当单击.addrow链接时，我想添加一个新行，但对于每个name，我想为它们添加1。我有以下 JavaScript:

var x = 2;
var tablerow = '<tr><td><input type="text" name="qty'+ x++ +'" /></td><td><select name="colour'+ x++ +'"><option value="">[Please Select]</option><option value="Red">Red</option><option value="Black">Black</option><option value="White">White</option></select></td><td><select name="colour'+ x++ +'"><option value="">[Please Select]</option><option value="Small">Small</option><option value="Medium">Medium</option><option value="Large">Large</option><option value="XL">XL</option><option value="2XL">2XL</option></select></td><td><input type="text" name="name'+ x++ +'" /></td><td>18</td><td><a href="javascript:;" class="remove">Remove Row</a></td></tr>'; 

$('.addrow').click(function(){
  $('tr:last-child').after(tablerow);
});

显然，到最后这个值会增加到 5。

我的问题是，增量只能在添加整行之后运行吗？

Answer 1

每次编写 x++ 时，x 都会递增。从第一次出现的 x 中删除++，仅在最后一次出现后保留 x++。

例如，如果您使用字符串: "b"+ x++ + "b"+ x++ + "b"+ x++ ，您将把 x 增加三倍，但如果您像 "b"+ x + 那样使用它"b"+ x + "b"+ x++ ，只增加 x 一次。