如何使用jQuery获取表单中动态添加的文本输入框的每个值？

嘿，我来帮你搞定这个问题！首先得提个重要的小细节：HTML规范里元素的id必须是唯一的，多个输入框用同一个id会导致选择器失效（比如jQuery用$('#相同id')只会拿到第一个匹配的元素），还可能引发其他页面问题。所以建议你去掉重复的id，只保留class来标识这些动态生成的输入框就好啦。

接下来给你两种常用的获取值的方法：

方法一：逐个遍历处理每个输入框的值 #

用jQuery的.each()方法遍历所有带目标class的输入框，逐个获取值并处理：

// 替换成你实际的输入框类名，比如这里用dynamic-input
$('.dynamic-input').each(function(index, element) {
  // 获取当前输入框的值，$(this)指向当前遍历到的输入框
  const currentValue = $(this).val();
  
  // 这里可以根据需求做处理，比如打印到控制台、存到变量里
  console.log(`第 ${index + 1} 个输入框的值：${currentValue}`);
});

方法二：把所有值收集到数组里 #

如果需要一次性获取所有输入框的值并存储到数组中，可以用.map()配合.get()：

// 同样替换成你的输入框类名
const allInputValues = $('.dynamic-input').map(function() {
  // 返回每个输入框的值
  return $(this).val();
}).get(); // 把jQuery对象转换成普通数组

// 现在allInputValues就是包含所有输入框值的数组了
console.log(allInputValues); // 输出示例：["值1", "值2", "值3"]

额外小提示 #

如果你的输入框有相同的name属性（比如<input name="user-input">），也可以用属性选择器来获取：

$('input[name="user-input"]').each(function() {
  // 同样的方式处理值
});

内容的提问来源于stack exchange，提问作者Benjamin Mwendwa Munyoki