2013-09-05 2 views
1

Я пытаюсь получить значение из ввода, а если значение = 1,2,3 ... показать содержимое else, если значение = 4,5,6 ... показать другой контент. Я чуть было не работал, потом что-то сломалось. Я играю с этим целую вечность. Может кто-нибудь быстро взглянуть и указать мне, где я его сломал.jQuery IF Value Equals Show Else Show

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(); 
    } 
+1

= правопреемников, == равно, === строгие равенства. use === –

+1

Что они (^^^ vvv) сказали. Кроме того, вы могли бы сделать этот код * намного короче, если бы вы использовали числовые идентификаторы (а не слово «один» и т. Д.). –

+0

Вы явно ошиблись с этим кодом. Вероятно, его можно было легко перестроить в пару строк, с гораздо лучшей ремонтопригодностью. – slhck

ответ

3
if(amount = '1') // it is assigning not the comparision 

Правильный путь для comaprision

if(amount === '1') 
+0

Спасибо, я знал, что это что-то простое. Я работал, но со всей копией и вставкой он забыл простейшую вещь. Спасибо – Delete

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

изменение

if(amount == '8'){ 
0

Вы должны изменить свой знак равенства '=' к '==' или '===', который будет сравнивать и не назначать. Также для вашего кода лучшая структура будет switch, возможно с for петлями. Будет легче отслеживать и отлаживать при необходимости.

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(); 
} 
+0

+1 в моих глазах это должен быть правильный ответ, а ppl должен научиться кодовому умнее! –

2

Примечание: учитывая ваши элементы упорядочены от 1 до 12

Чтобы сократить код очень вы можете использовать: lt. и select with *.

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

DEMO

В противном случае другой способ сделать это меняет класс всех элементов product-addon-anttendee

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

и используя этот код

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

DEMO

+0

+1 для умного кодирования. :) –

0

Лучше вариант вместо этого, если заявление:

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; 
}