1

我正在尝试从输入中获取值，如果值 = 1,2,3... 则显示其他内容，如果值 = 4,5,6... 则显示其他内容。我几乎让它工作了，然后东西坏了。我玩这个已经很久了。任何人都可以快速查看并指出我在哪里弄坏了它。

var amount = $(".quantity-wrapper > .input-text").val();
    if(amount = '1') {
        $('.product-addon-one-attendee').show();
    }
    if(amount = '2'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
    } 
    if(amount = '3'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
    } 
    if(amount = '4'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
    } 
    if(amount = '5'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
    }
    if(amount = '6'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
    }
    if(amount = '7'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
    }
    if(amount = '8'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
    }
    if(amount = '9'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        $('.product-addon-nine-attendees').show();
    }
    if(amount = '10'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        $('.product-addon-nine-attendees').show();
        $('.product-addon-ten-attendees').show();
    }
    if(amount = '11'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        $('.product-addon-nine-attendees').show();
        $('.product-addon-ten-attendees').show();
        $('.product-addon-eleven-attendees').show();
    }
    if(amount = '12'){
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        $('.product-addon-nine-attendees').show();
        $('.product-addon-ten-attendees').show();
        $('.product-addon-eleven-attendees').show();
        $('.product-addon-twelve-attendees').show();
    }
4

6 回答 6

7 
if(amount = '8'){  // you forget ==

在某一方面的变化

if(amount == '8'){
于 2013-09-05T08:27:15.720 回答
3 
if(amount = '1') // it is assigning not the comparision

比较的正确方法

if(amount === '1')
于 2013-09-05T08:28:02.920 回答
2

注意：考虑到您的元素是从 1 到 12 排序的

要大大缩短代码，您可以使用 :lt 。并使用 * 选择。

   $('[class*="product-addon-"]:lt('+(amount)+')').show();

演示

否则，另一种方法是将所有元素上的类更改为product-addon-anttendee

<div class="product-addon-attendee">1</div>
<div class="product-addon-attendee">2</div>

并使用此代码

$('.product-addon-attendee:lt('+amount+')').show();

演示

于 2013-09-05T08:48:55.720 回答
2

其他人指出您应该使用比较运算符，但是如何减少那些丑陋和重复的代码。您需要更改标记，以便最终生成：

product-addon-1-attendee product-addon-2-attendee product-addon-n-attendee

// Get the amount value as a number
var amount = parseInt($(".quantity-wrapper > .input-text").val(), 10) || 0;

for (var i = 0; i < amount; ++i) {
    $('.product-addon-' + (i + 1) + '-attendee').show();
}
于 2013-09-05T08:32:08.440 回答
0

您需要将等号更改'='为'=='or'==='将比较而不是分配。同样对于您的代码，更好的结构将是 a switch，可能带有for循环。如果需要，它将更容易跟踪和调试。

于 2013-09-05T08:29:42.933 回答
0

更好的选择，而不是 if 语句：

var amount = $(".quantity-wrapper > .input-text").val();
switch (amount) {
    case ('1'):
        alert('1');
        $('.product-addon-one-attendee').show();
        break;
    case ('2'):
        alert('2');
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        break;
    case ('3'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        break;
    case ('4'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        break;
    case ('5'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        break;
    case ('6'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        break;
    case ('7'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        break;
    case ('8'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        break;
    case ('9'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        $('.product-addon-nine-attendees').show();
        break;
    case ('10'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        $('.product-addon-nine-attendees').show();
        $('.product-addon-ten-attendees').show();
        break;
    case ('11'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        $('.product-addon-nine-attendees').show();
        $('.product-addon-ten-attendees').show();
        $('.product-addon-eleven-attendees').show();
        break;
    case ('12'):
        $('.product-addon-one-attendee').show();
        $('.product-addon-two-attendees').show();
        $('.product-addon-three-attendees').show();
        $('.product-addon-four-attendees').show();
        $('.product-addon-five-attendees').show();
        $('.product-addon-six-attendees').show();
        $('.product-addon-seven-attendees').show();
        $('.product-addon-eight-attendees').show();
        $('.product-addon-nine-attendees').show();
        $('.product-addon-ten-attendees').show();
        $('.product-addon-eleven-attendees').show();
        $('.product-addon-twelve-attendees').show();
        break;
}
于 2013-09-05T08:49:35.987 回答