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

尝试以下代码。在jsFiddle.net上查看this演示。这将为您提供表格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小提琴。在这里，您将获得两个数组中的值。

Answer 2

$（“＃txtName”）是指您在

中声明的文本框

<input id="txtName" type="text" />

由于您要检索已插入表中的所有数据，因此应使用$（“td”，“＃tbNames”）并检索其.text（）

$("td", "#tbNames").each(function() {
    console.log($(this).text());
});

Answer 3

您需要将click事件绑定为实时。由于普通绑定只会将事件绑定到第一次在页面渲染中找到的元素

以下是更正部分：

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

Answer 4

你的提交按钮没有被触发

http://jsfiddle.net/gBHh2/

检索添加的jquery行

4 个答案: