javascript - 检索添加的 jquery 行

Question

我在检索用户添加的行内的所有数据时遇到问题。我尝试使用我的变量 reclist 来检索记录，但它给了我空白。

源码如下:

<script type="text/javascript">
$(document).ready(function(){
   $('#btnAdd').live('click',function(){
      var name = $('#txtName').val();
      var name2 = $('#txtName2').val();
      $("#tbNames tr:last").after("<tr><td>" + name + "</td><td>" + name2 + "</td><td><img src='delete.gif' class='delete' height='15' /></td></tr>");
  });

   $('#tbNames td img.delete').live('click',function(){
        $(this).parent().parent().remove(); 
   });
 });
</script>

<input id="txtName" type="text" />
<input id="txtName2" type="text" />
<input id="btnAdd" type="button" value="Add" />
   <table id="tbNames" >
      <tr>
         <td><b>Name</b></td>
         <td><b>Name2</b></td>
         <td><b>Delete</b></td>
      </tr>
      <tr>
          <td>Bingo</td>
          <td>Tingo</td>
          <td><img src="Delete.gif" height="15" class="delete" /></td>
      </tr>
   </table>

<script type="text/javascript">
$(document).ready(function() {
    $("#submit_app").button();
    $("#submit_app").click(function() {
    var reclist = $("#txtName").val();
    console.log(reclist);
    });
});
</script>

<input id="submit_app" type="button" style="height: 35px; width: 225px" value="Add New User" />

如果我遗漏了任何编码，请告知。

Answer 1

试试下面的代码。检查this jsFiddle.net 上的演示。这将为您提供表格 td 内的所有值。

$(document).ready(function() {
  $('#btnAdd').live('click', function() {
    var name = $('#txtName').val();
    var name2 = $('#txtName2').val();
    $("#tbNames tr:last").after("<tr><td>" + name + "</td><td>" + name2 + "</td><td><img src='delete.gif' class='delete' height='15' /></td></tr>");
  });

  $('#tbNames td img.delete').live('click', function() {
    $(this).parent().parent().remove();
  });

  //$("#submit_app").button(); //Commented this line
  $("#submit_app").click(function() {
      var skipFirstRow = 0; //Skip first row
      $("#tbNames tr").each(function() {
          if (skipFirstRow++ == 0) return;
          var skipLastColumn = 0;
          $(this).children("td").each(function() {
              if (skipLastColumn++ == 2) return;
              alert($(this).html());
          });
     });
     var reclist = $("#txtName").val();
     console.log(reclist);
  });
});

编辑

检查 this fiddle 。在此您将获得两个数组中的值。