使用 Jquery 获取输入值数组答案

【问题标题】：Getting an array of input values with Jquery使用 Jquery 获取输入值数组
【发布时间】：2018-11-02 23:30:44
【问题描述】：

我正在选择所有具有“img-title”类的输入元素，以获取具有这些输入的当前值的数组：

var values = []
for (let element of $(".img-title")){ 
   values.push( element.val() ) }

但这不起作用，因为$(".img-title")的元素不是我预期的对输入的引用，而是html代码，所以val()会报错。有没有一种简单的方法来获取具有“img-title”类的输入的当前值的数组？

【问题讨论】：

【解决方案1】：

当您在 jQuery 集合上使用 for..of 时，您返回的项目是元素本身，而不是包含该元素的 jQuery 集合。在调用 .val() 之前先将元素转换为 jQuery 集合：

const values = []
for (const element of $(".img-title")){ 
  values.push( $(element).val() )
}

或者，仅使用 .value 访问本机元素上的属性：

const values = []
for (const element of $(".img-title")){ 
  values.push( element.value )
}

或者，考虑改用.map：

const values = $(".img-title")
  .map(function() {
    return $(this).val();
  })
  .get();

（确保最后使用.get()，以获取数组，而不是jQuery集合）

或者，如果你愿意，完全避免使用 jQuery，不需要像这样简单的东西包含一个大的库：

const values = Array.prototype.map.call(
  document.querySelectorAll('.img-title'),
  element => element.value
);

【讨论】：