与.closest() .siblings() .find()混淆

Question

我有这样的代码：

<div id="wrapf">

<div class="dropsf">
  <select name="f" class="food">
    <option value="" rel="">Choose!</option>
    <option value="1" rel="2">1</option>
    <option value="3" rel="6">2</option>
    <option value="7" rel="14">3</option>
  </select>
</div>

<div class="serve">
 <button id="plus">+</button>
 <input id="srv" name="srv" class="srv" type="text" value="1" size="2" readonly="readonly"/>
 <button id="minus">-</button>
</div>

</div><!-- #wrapf -->

在向上面的代码添加一些<div>之前，我已经有了这段代码(出于对齐和CSS的原因)：

var food = $(".food"),
    cc = [],
    gc = [];

    //Push values into an array.
for(var i = 0; i < food.length; i++) {
  var v = food.eq(i).find('option:selected').val();
  var m = food.eq(i).siblings('input[name=srv]').val();
    gc.push(food.eq(i).find('option:selected').attr('rel'));
    cc.push(v * m); 
 }

但是现在我的javascript不工作了，我对如何从下拉列表中获取值感到困惑……(我附加了每个下拉列表，这就是我使用for语句的原因)，我的v变量可以正常工作，gc.push语句也可以工作，但是我的m变量没有注册。我正在尝试从serving输入中获取值，我该怎么做呢？

ps。我也尝试过.find()

Answer 1

input[name=srv]不是.food的兄弟。另外，对于遍历jQuery对象，我建议使用.each。

var food = $(".food"),
    cc = [],
    gc = [];

food.each(function(){
    var $this = $(this),
        // you can just get the val of the select
        val = $this.val(),
        // this is the same as $(this).find('option:selected')
        option = $('option:selected', this),
        // or even simpler: $('#srv').val();
        inputVal = $this.parent('.dropsf').siblings('.serve').find('input[name=srv]').val();
    gc.push(option.attr('rel'));
    cc.push(val * inputVal);
});

Answer 2

food.closest('#wrapf').find('input[name=srv]').val()

应该行得通

Answer 3

id不是唯一的吗？那么，这不应该是可行的吗？

$("#srv").val()

顺便说一句，你不需要这样做：

var v = food.eq(i).find('option:selected').val();

你可以这样做(如果你有多个食物)：

var v = food.eq(i).val();

val()已经为您提供了当前选定的值。