显示每个中继器项目的值答案

【问题标题】：Display the value on each repeater item显示每个中继器项目的值
【发布时间】：2019-08-08 09:50:53
【问题描述】：

我使用 jquery 转发器创建动态表单。

<div class="repeater">
  <table border="1">
    <thead>
      <tr style=>
        <th>ID</th>
        <th>Name</th>
      </tr>
    </thead>
    <tbody data-repeater-list="data">
      <tr data-repeater-item>
        <td><input name="this_id" value="1"></td>
        <td><input name="this_name"></td>
      </tr>
    </tbody>
  </table>
  <button data-repeater-create>Add New</button>
</div>

<script>
  $('.repeater').repeater();

  /* Not working if use below code :
  Reference : https://github.com/DubFriend/jquery.repeater

    $('.repeater').repeater({
      defaultValues: {
        'this_id': '1'
      }
    });
  */
</script>

当我按下“添加新”按钮时，为什么 this_id 的默认值没有出现（空白值）。我的代码有问题吗？

更新： https://jsfiddle.net/b6tryg9m/

【问题讨论】：

您是否包含了 jQuery 和 jQuery Repeater 脚本文件？你用的是哪个版本？创建一个小提琴并包含它。您会得到更多、更快的响应。
@AyushKumar，谢谢你的建议。我已经对该代码做了一个小提琴（有问题的链接）。我使用 jquery 3.3.1 和 jquery.repeater 1.2.1。

标签： jquery html jquery.repeater

【解决方案1】：

您在输入元素上设置了 type="text"。这是一个工作示例：

$('.repeater').repeater({
  defaultValues: {
    'this_id': '1',
    'this_name': 'foo'
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.repeater/1.2.1/jquery.repeater.min.js"></script>
<div class="repeater">
  <table border="1">
    <thead>
      <tr style="background-color:#cecece">
        <th>ID</th>
        <th>Name</th>
      </tr>
    </thead>
    <tbody data-repeater-list="data">
      <tr data-repeater-item>
        <td><input type="text" name="this_id" value="1"/></td>
        <td><input type="text" name="this_name"/></td>
      </tr>
    </tbody>
  </table>
  <br>
  <button data-repeater-create>Add New</button>
</div>

【讨论】：

我想，如果没有 type="text" 属性的输入将被视为 jquery.repeater 中的文本。感谢您的回答，它有效。
参考Input Element types

【解决方案2】：

你只需要定义输入类型

type="text"

【讨论】：