Question

我有一张这样的表

<table><tbody>
<tr class="row"><td style="display:none">902</td>
  <td>visitas@greenblue.pe<input type="hidden" value="visitas@greenblue.pe" name="email[]"></td>
  <td><input type="input" value="" class="validate" name="nombre[]"></td>
  <td><input type="input" value="" name="empressa[]"></td>
  <td><input type="input" value="" name="paginaWeb[]"></td>
  <td><input type="input" value="" name="telefono[]"></td>
  <td><input type="input" value="" name="cellular[]"></td>
</tr>
</tbody></table>

我正在尝试使用Jquery创建一个数组，该数组保存输入类型的名称作为数组的键

 var rows = []; 
    $('.row').each(function (i) {
                        var content = {};
                        $(this).find('td').each(function (j, v) {
                            var input = $("input", this),
                                name = input.attr("name").substring(0, input.attr("name").length - 2),
                                value = input.val();
                            content[name] = value;
                        });
                        rows.push(content);
                    });

但我收到的错误是attr()未定义。

任何人都可以帮助我

Answer 1

首先，而不是

$(this).find('td').each(function(j, v) {
    var input = $("input", this)

DO

$(this).find('td input').each(function(j, v) {
    var input = $(this)

var rows = [];
$('.row').each(function(i) {

  var content = {};
  $(this).find('td input').each(function(j, v) {
    var input = $(this),
      name = input.attr("name").substring(0, input.attr("name").length - 2),
      value = input.val();
    content[name] = value;
    
  });
  rows.push(content);
  console.log(rows);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr class="row">
      <td style="display:none">902</td>
      <td>visitas@greenblue.pe
        <input type="hidden" value="visitas@greenblue.pe" name="email[]">
      </td>
      <td>
        <input type="input" value="" class="validate" name="nombre[]">
      </td>
      <td>
        <input type="input" value="" name="empressa[]">
      </td>
      <td>
        <input type="input" value="" name="paginaWeb[]">
      </td>
      <td>
        <input type="input" value="" name="telefono[]">
      </td>
      <td>
        <input type="input" value="" name="cellular[]">
      </td>
    </tr>
  </tbody>
</table>

Answer 2

由于每行中的第一个td没有输入input.attr("name")，因此未定义，因此调用.substring()会导致错误。

var rows = [];
$('.row').each(function (i) {
    var content = {};
    $(this).find('td input').each(function (j, v) {
        var input = $(this),
            name = input.attr("name").substring(0, input.attr("name").length - 2),
            value = input.val();
        content[name] = value;
    });
    rows.push(content);
});

您也可以

var rows = $('.row').map(function (i) {
    var content = {};
    $(this).find('td input').each(function (j, v) {
        var name = this.name.replace(/\[\]$/, ''),
            value = this.value;
        content[name] = value;
    });
    return content;
}).get();

Answer 3

首先，没有输入类型'输入'。其次，对于没有输入子元素的第一个td，您将收到错误。这将导致异常并且循环中断。

如果您使用type ='text'并在尝试处理其name属性之前检查输入的长度是否大于0，那么它将正常工作。

这是一个可以做你想做的事的小提琴：https://jsfiddle.net/vtaeht71/

var rows = []; 
$('.row').each(function (i, row) {
                    var content = {};
                    $('td', row).each(
                        function (j, td) {
                        var input = $("input", td),
                            name, value;
                            if (input.length > 0) {

                                name = input.attr("name").substring(0, input.attr("name").length - 2),
                                value = input.val();

                                content[name] = value;
                            }
                    });
                    rows.push(content);
                });

遍历Jquery中的表

3 个答案: