javascript - jquery 插件中的每个循环都失败了吗？

Question

谁能给我解释一下这里发生了什么？？

我有这个 html 代码:

   <div class="calculadora">

      <div class="clear campos">
       <label>Amount</label>
       <input class="fi" id="amount" type="text" name="amount" value=""/>
      </div>

      <div class="clear campos">
       <label>Down Payment</label>
       <input class="fi" id="downPay" type="text" name="downPay" value=""/>
      </div>

      <div class="clear campos">
       <label>Years</label>
       <input class="fi" id="years" type="text" name="years" value=""/>
      </div>

      <div class="clear campos">
       <label>Rate</label>
       <input class="fi" id="rate" type="text" name="rate" value=""/>
      </div>

      <input id="cal" type="button" value="cacular"/>
      <div class="result"></div>
          </div>

我正在制作一个 jquery 插件，但我需要获取每个输入的所有 attr('value')，我正在这样做:

this.each(function(){

        var obj = $(this),
        vacio = parseFloat( $('.fi', obj).attr('value'));

       // some code...

但是会发生什么，它只获得第一个输入的第一个值...为什么？？

但是!!如果我这样做:

var s = $('.fi', obj).each(function(){
             alert ($(this).attr('value'))
            });

有效!!!为什么？？这样好吗？？？

如果有人能向我解释，请提前致谢。

Answer 1

.attr()从调用集合中的第一个元素返回指定属性的值。

来自文档:

Get the value of an attribute for the first element in the set of matched elements.

当您以另一种方式实现时，您正在为匹配集中的每个元素提取值属性数据。

实现您所追求的目标的一种方法是使用 .map()函数，它返回一个 jquery 数组:

var vals = $('.fi', obj).map(function(){
    return this.value;
});

要将其转换为纯 javascript 数组，您可以使用 vals.toArray();

注意:不需要 jquery 获取输入的值，因为事件处理程序和元素迭代中的 this 是当前 DOMElement，因此您可以只执行 this.value.