Question

我无法使用唯一的ID号获取附加行的输入值。它总是返回undefined。当我从id =“aaa1'+ x +'”中删除''x'时，我能够获得值，但是当我添加x（用于应用唯一ID）时，它总是返回undefined。非常感谢您的帮助。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<table class="table table-bordered customFields2" id="myTable1">
  <tr>
    <td><label class="w3-validate">Components Required</label></td>
    <td><label class="w3-validate">Description</label></td>
    <td><label class="w3-validate">Qty Per</label></td>
    <td><label class="w3-validate">Total Qty</label></td>
  </tr>
  <tr>    
    <td><input class="form-control input-sm w3-input" id="a" type="text" required></td>
    <td><input class="form-control input-sm w3-input" id="b" type="text" required></td>
    <td><input class="form-control input-sm w3-input" id="c" type="text" required></td>
    <td><input class="form-control input-sm w3-input" id="d" type="text" required></td>
  </tr>
</table>
<button id="a1" class="w3-btn w3-hover-cyan"><i class="fa fa-plus-circle"></i> Add Row</button><hr>

byte[]

Answer 1

// alert($('#a').val());
// alert($('#b').val());
// alert($('#c').val());
// alert($('#d').val());

var x = 0;
$('#a1').click(function() {
  $('#myTable1').append(
    '<tr><td><input class="form-control input-sm w3-input" id="aaa1' + x + '" type="text" value="123"></td><td><input class="form-control input-sm w3-input" type="text" id="bbb' + x + '"></td><td><input class="form-control input-sm w3-input" id="ccc" type="text"></td><td><input class="form-control input-sm w3-input" id="ddd" type="text"></td></tr>'
  );
  x = x + 1;

  alert($('#aaa' + x).length);
  alert($('#bbb' + x).length);
  alert($('#ccc' + x).length);
  alert($('#ddd' + x).length);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<table class="table table-bordered customFields2" id="myTable1">
  <tr>
    <td>
      <label class="w3-validate">Components Required</label>
    </td>
    <td>
      <label class="w3-validate">Description</label>
    </td>
    <td>
      <label class="w3-validate">Qty Per</label>
    </td>
    <td>
      <label class="w3-validate">Total Qty</label>
    </td>
  </tr>
  <tr>
    <td>
      <input class="form-control input-sm w3-input" id="a" type="text" required>
    </td>
    <td>
      <input class="form-control input-sm w3-input" id="b" type="text" required>
    </td>
    <td>
      <input class="form-control input-sm w3-input" id="c" type="text" required>
    </td>
    <td>
      <input class="form-control input-sm w3-input" id="d" type="text" required>
    </td>
  </tr>
</table>
<button id="a1" class="w3-btn w3-hover-cyan"><i class="fa fa-plus-circle"></i> Add Row</button>
<hr>

因为如果检查长度为零，则在此期间输入不存在
另外，如果您的身份证明错误，请aaa1警告您aaa

Answer 2

我找到了解决方案。

请在下方办理登机手续。 https://jsfiddle.net/0htvshzk/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<table class="table table-bordered customFields2" id="myTable1">
  <tr>
    <td>
      <label class="w3-validate">Components Required</label>
    </td>
    <td>
      <label class="w3-validate">Description</label>
    </td>
    <td>
      <label class="w3-validate">Qty Per</label>
    </td>
    <td>
      <label class="w3-validate">Total Qty</label>
    </td>
  </tr>
  <tr>
    <td>
      <input class="form-control input-sm w3-input" id="a" type="text" required>
   </td>
   <td>
     <input class="form-control input-sm w3-input" id="b" type="text" required>
  </td>
  <td>
  <input class="form-control input-sm w3-input" id="c" type="text" required>
  </td>
<td>
  <input class="form-control input-sm w3-input" id="d" type="text" required>
 </td>
 </tr>
</table>
<button id="a-0" class="w3-btn w3-hover-cyan"><i class="fa fa-plus-circle"></i> Add Row</button>
<hr>

$('#a-0').click(function() {
var id = $(this).attr("id");
var x  = id.split("-").pop();
 $('#myTable1').append(
'<tr><td><input class="form-control input-sm w3-input" id="aaa' + x + '" type="text" value="123"></td><td><input class="form-control input-sm w3-input" type="text" id="bbb' + x + '"></td><td><input class="form-control input-sm w3-input" id="ccc" type="text"></td><td><input class="form-control input-sm w3-input" id="ddd" type="text"></td></tr>' 
);
   x = parseInt(x)+1;
   var aid  ='#aaa'+ x;
   var bid  ='#bbb'+ x;
   var cid  ='#ccc'+ x;
   var did  ='#ddd'+ x;
   alert(aid);
   alert(bid);
   alert(cid);
   alert(did);
   $(this).attr("id",'a-'+x);
});

无法从附加表td获取值

2 个答案: