如何获取表格列中多个文本框的值

Question

我坚持我的项目。 在我的jsp页面上，我有一个html table 。 一列即addresses有多个带有值的textboxes 。 最后一列有一个名为edit的链接。

我想要什么：点击编辑我想要用逗号分隔的地址值。

我做了什么（点击编辑）：

var values = $(this).closest('tr').find('[type=text]').val();

我得到的是：只有一个值（不是其他文本字段值）

我想要什么（示例）：纽约，华盛顿。 （如果addresses栏中有 2 个文本框，其中 newyork 和 Washington 作为地址值）

Answer 1

根据http://api.jquery.com/val/ val() 仅返回第一个值。 如果您想要所有这些，则需要进行迭代，例如：

var s = []; 
$(this).closest('tr').find('[type=text]').each(function(v) { 
    s.push(v.val());
})

PS Array.prototype.map 在这里很有用

Answer 2

要获取所有输入的值，您可以使用map函数遍历所有输入，然后使用get函数将所有值放入数组中：

 var values = $('[type=text]').map(function() { return $(this).val(); }).get(); console.log(values);

 <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" name="a" value="a - val" /> <input type="text" name="b" value="b - val" />

你的代码应该是这样的：

var values = $(this).closest('tr').find('[type=text]').map(function() {
    return $(this).val();
}).get();

添加表格图像后的更好示例：

 $('#a1').click(function() { var values = $(this).closest('tr').find('[type=text]').map(function() { return $(this).val(); }).get(); alert(values); });

 <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr> <td> <input type="text" name="a" value="a - val" /> <input type="text" name="b" value="b - val" /> </td><td> <div id="a1">edit</div> </td> </tr> </table>