如何使用“只读”元素获取表的数据

Question

我正在尝试获取表格的所有元素，它有一个按钮，可以添加一行带有可编辑的输入，但如果按下旧的输入，则会获得道具“readonly”。所有这些都是带有提交按钮的表单，问题是我无法通过“readonly”道具获取行的数据，但我确实得到了span

中的行

我的js。

$('#form_trasferencia').submit(function (e) {
  e.preventDefault()
  var table = $('#tabla_transferencia')
  var salida = {}
  table.find('tr').each(function (i, el) {
    var $tds = $(this).find('td'),

    codigo = $tds.eq(0).val() || $tds.eq(0).text(),
    cantidad = $tds.eq(3).val() || $tds.eq(3).text(),
    costo_unit = $tds.eq(4).val() || $tds.eq(4).text(),
    total = $tds.eq(5).val() || $tds.eq(5).text(),

    aux = {'codigo': codigo, 'cantidad': cantidad, 'costo_unit': costo_unit, 'total': total}

   console.log(aux)
  })

我的表

<table class="table table-striped table-bordered" id="tabla_transferencia">
  <thead>
    <tr>
      <th style="width: 80px">Codigo</th>
      <th style="width: 500px">Descripción</th>
      <th>Existencias</th>
      <th>Cantidad</th>
      <th>Costo/Unit</th>
      <th style="width: 40px">Total</th>
      <th></th>
    </tr>
  </thead>

  <tbody>
    <tr id='row0' class="datos_tabla_transferencia">
      <td><input type="text" id="txt_transferencia_codigo0" placeholder="Ingese el código" required></td>
      <td><span id="spn_transferencia_descripcion0"></span></td>
      <td><span id="spn_transferencia_existencias0"></span></td>
      <td><input type="number" id="txt_transferencia_cantidad0" placeholder="Cantidad" required readonly></td>
      <td><input type="text" id="txt_transferencia_costoUni0" placeholder="Costo/Unitario" required readonly></td>
      <td><span id="spn_transferencia_total0"></span></td>
      <td>
        <button type="button" id="0" data-id="row0" class="btn btn-danger
                                                        btn-xs remove">-
                                                </button>
      </td>
    </tr>
  </tbody>


</table>
<button id="btn_transferencia_nuevo" class="btn btn-default pull-left" disabled>
 Agregar
</button>

我的输出

Answer 1

问题是你要选择任何一个   $ tds.eq（0）.text（）这是 td 元素=＆gt;内的文字这是跨度内的文字
或
$ tds.eq（0）.val（）这是 td 元素=＆gt;的值td没有值，所以它返回空值（，这是你的问题的原因）

您可以选择输入元素的值 td

你可以尝试这样的事情：
替换这些行

codigo = $tds.eq(0).val() || $tds.eq(0).text(),
cantidad = $tds.eq(3).val() || $tds.eq(3).text(),
costo_unit = $tds.eq(4).val() || $tds.eq(4).text(),
total = $tds.eq(5).val() || $tds.eq(5).text(),

与

odigo = $tds.eq(0).find('input').val() || $tds.eq(0).text(),
cantidad = $tds.eq(3).find('input').val()  || $tds.eq(3).text(),
costo_unit = $tds.eq(4).find('input').val() || $tds.eq(4).text(),
total = $tds.eq(5).find('input').val()  || $tds.eq(5).text(),

指定您需要文本或输入的值 td ，而不是 td <的值/ strong>本身。