从表格内的输入框获取输入答案

【问题标题】：Getting input from input-boxes inside tables从表格内的输入框获取输入
【发布时间】：2012-02-05 12:00:43
【问题描述】：

<!DOCTYPE html>
<html>
<head>
  <style>

  p { color:blue; margin:8px; }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>

  //region 1
  <!--<input type="text" class="plo" value="some text"/>
  <input type="text" class="plo" value="some text"/>
  <input type="text" value="some text"/>-->

  //region 2
 <!-- <table>
  <tr><td><input type="text" class="plo" value="some text"/></td></tr>
  <tr><td><input type="text" class="plo" value="some text"/></td></tr>
  <tr><td><input type="text" value="some text"/></td></tr>
  </table>
  -->

  <p></p>
<script>
    /*$(".plo").keyup(function () {
      var value = $(this).val();
      $("p").text(value);
    }).keyup();*/

    /*$(".plo").keyup(function () {
      var value = $(this).val();
      $("p").text(value);
    }).keyup();*/

    $(".plo:last").keyup(function () {
      var value = $(this).val();
      $("p").text(value);
    }).keyup();
</script>

</body>
</html>

在此代码中，选择了中间的输入框，每当用户在其中输入任何内容时，它都会再次显示在下一行中。问题是如果使用区域 1，它可以正常工作，但如果使用区域 2，即它放置在表中，则它不会。我有一个 10x10 的表格，我需要处理来自每个单元格的输入。请帮忙

【问题讨论】：

我已经（在 Chrome 中）测试了您的确切代码，其中区域 2 未注释，并且编辑中间文本框中的文本会更改 <p></p> 部分的内容。

标签： jquery html-table textinput

【解决方案1】：

不确定为什么要同时注释掉 HTML 源代码和 JavaScript，但是在取消注释 HTML 并将代码更改为在 $(document).ready() 中运行（并删除冗余调用）之后，注释掉的 JavaScript 具有想要的效果。

$(document).ready(function () {
    $(".plo").keyup(function() {
        var value = $(this).val();
        $("p").text(value);
    });
});

【讨论】：