2013-09-02 6 views
1
<input type="radio" name="CAT_Custom_332258_327" value="Standard" class="member-type" /> 
<input type="radio" name="CAT_Custom_332258_327" value="Youth" class="member-type" /> 
<input type="radio" name="CAT_Custom_332258_327" value="Family Add-On" class="member-type" /> 

<input type="radio" name="highflight" value="print" class="highflight-type" /> 
<input type="radio" name="highflight" value="digital" class="highflight-type" /> 
<input type="radio" name="highflight" value="printdigital" class="highflight-type" /> 

У меня есть два набора переключателей и текстовое поле «Сумма» (#Amount). Когда я меняю выделение во втором наборе радиокнопки (.highflight-type), он должен обновлять текстовое поле «Сумма» на основе значений обоих наборов переключателей.Вложенные инструкции JQuery IF не работают

$(".highflight-type").click(function(){ 

       if($(this).val()=="print") { 
        if($('.member-type').val()=="Standard") { 
         $('#Amount').val('35'); 
        } 
        if($('.member-type').val()=="Youth") { 
         $('#Amount').val('35'); 
        } 
       } 

       if($(this).val()=="digital") { 
        if($('.member-type').val()=="Youth") { 
         $('#Amount').val('10'); 
        } 
        if($('.member-type').val()=="Standard") { 
         $('#Amount').val('25'); 
        } 
       } 
       if($(this).val()=="printdigital") { 
        if($('.member-type').val()=="Standard") { 
         $('#Amount').val('50'); 
        } 
        if($('.member-type').val()=="Youth") { 
         $('#Amount').val('35'); 
        } 
       } 
      }); 

Однако, когда у меня есть «Юность», выбранный в первом наборе радиокнопки (.member-типа) и измените второй переключатель на «цифровой», я получаю значение #amount в $ 25 вместо $ 10 , Я использовал предупреждение для подтверждения значения типа .member в DOM в момент изменения выбора переключателя типа .highflight.

ответ

1

Если вы просто изменить

if($('.member-type').val()=="...") 

в

if($('.member-type:checked').val()=="...") 

Тогда проблема будет решена.

DEMO.

+1

Я подозреваю, что все ответы, представленные до сих пор, действительны, но мне нравится простота этого - и, похоже, он работает для меня. Благодаря! –

+0

Цените это :-) –

4

$('.member-type').val() всегда будет возвращать value из первого переключателя .member-type.

Вместо этого, вы должны фильтровать радио кнопку, чтобы найти тот, который проверяется, и получить что значение радиооператора кнопки:

var $types = $('.member-type'); 
var $amount = $('#Amount'); 
var pricing = { 
    print: { 
     Standard: 35, 
     Youth: 35 
    }, 
    digital: { 
     Standard: 25, 
     Youth: 10 
    }, 
    printdigital: { 
     Standard: 50, 
     Youth: 30 
    } 
}; 

$(".highflight-type").change(function() { 

    if (! this.checked) return; 

    $amount.val(
     pricing[ this.value ][ $types.filter(':checked').val() ] 
    ); 
}); 

Вот скрипка: http://jsfiddle.net/C8kZq/

+1

Это очень учебное. Интересно, что я использую метод таргетинга более полутора лет без проблем. Только после того, как я попытался добавить эти вложенные ИФ, это начало меня огорчать. Независимо от того, я вижу, что вы здесь объясняете, и это отлично подходит для будущих ссылок. Пока я собираюсь попытаться свернуться с решением Херы, потому что это такое простое изменение. Спасибо. –

Смежные вопросы