Question

我所拥有的是我的jquery正在创建自动<li>元素。每个<li>元素包含1个选择框和1个输入框。所以我想要的是它应该进入每个<li>元素，然后它应该乘以选择框和输入框的数量，并为每个<li>元素给出一个这个乘法。我已经为each()使用了jquery <li>函数以及select和input框。但它为每个

enter code here显示相同的值。

<li class="working">
    </span><span class="dd">

    <h3>Select Photo Size for above picture:</h3>

    <select class="price">
        <option value=".20" class="sz">6x4 (€0.20)</option>
        <option value="0.30" class="sz">5x7 (€0.20)</option>
        <option value="3.49" class="sz">8x6 (€3.49)</option>
    </select>


    <h3>Select quantity for above size:</h3>

    </span>

    <input type="text" name="qt" class="qt">

    <h3>Per Photo Price:</h3>

    </span>

    <h3 class="pr"></h3>

    <input type="text" class="knb" value="0" data-width="48" data-height="48"'+ ' data-fgColor="#0788a5" data-readOnly="1" data-bgColor="#3e4043" />

    <p class="ss"></p>

    <span class="close"></span>
</li>




$('.qt').each(function() {
       if(parseInt($('.qt').val()) >= 1 && parseInt($('.qt').val()) <= 99 &&
     $('.price').val() == '.20')
    {
        var a = $('.qt').val();
        var b = '.15';
        var c = a * b;
        $('.pr').text(c);
    }
    else if(parseInt($('.qt').val()) >= 100 && parseInt($('.qt').val()) <= 200 &&
     $('.price').val() == '.20')
    {
        alert('Its greater');
    } 
});

Answer 1

将parseInt($('.qt').val())替换为parseInt($(this).val())，因为您正在迭代每个元素。 $('.qt')代表所有 '.qt'。

改进提示：

由于您多次执行parseInt($('.qt').val())（应该由$(this).val()替换，正如我所说），只执行一次并将其存储在变量中。

$('.qt').each(function() {

   var amount = parseInt($(this).val()),
       priceVal = $('.price').val();

   if(priceVal == '.20'){
      if(amount >= 1 && amount <= 99){
         var a = $('.qt').val(),
             b = '.15',
             c = a * b;
         $('.pr').text(c);
      }else if(amount <= 200){
         alert('Its greater');
      }
   }
});

此外，if(amount >= 100)没用，因为它已经失败了if(amount <= 99)测试，所以它必然是> = 100。我也分解了if(priceVal == '.20')。

修改

好的，现在我有你的HTML代码，它真的不符合JS代码的建议......

您正在迭代.qt，而不是li元素。 .qt是输入字段，而不是li。

$("li.working").each( function(){ var $this = $(this), selectedPrice = parseInt($this.find("select.price").val()), quantity = parseInt($this.find("input.qt").val()); totalPrice = selectedPrice * quantity; $this.find("h3.pr").text(totalPrice); });

您生成的代码中有奇怪的</span>和已恢复的</span><span class="dd">元素，我强烈建议您查看并清理它。

Answer 2

我会这样做：

请注意，如果没有您的html结构，我还没有更改$('.pr')选择器或$('.price')选择器以便您的所有{{1} }将被设置为最后的.pr计算。

~~我认为这些选择器类似于.qt - ＆gt;如果$(this).siblings('.pr')与pr位于同一级别的元素上。如果它位于不同单元格的表格中，它将是这样的：qt~~

根据您的HTML

进行了更新

$(this).closest('tr').find('.pr')

每个li元素的cal值

2 个答案: