라디오 버튼을 선택하고 선택 값을 선택한 경우 jquery

Question

업데이트 문제 : 이제는 흰색 셔츠를 작동시킬 수는 있지만 노란색은 사용할 수 없습니다. 나는 흰색의 small-med-lrg 사이를 전환 할 수 있지만 노란색으로 교체하는 것은 여전히 ​​흰색 셔츠 크기 사이에서만 변경됩니다. 당신은 입력에 클래스 size을 추가해야합니다

$('.size').click(function() { 
    shirtButtons.hide(); 
    if($('.color').val() == 'white' || $('.size:checked').val() == 'small'){ 
     shirtButtons.hide(); 
     $('.white-small').show(); 
    }else if($('.color').val() == 'yellow' || $('.size:checked').val() == 'medium'){ 
     shirtButtons.hide(); 
     $('.yellow-medium').show(); 
    } 
}); 
$('.color').change(function() { 
    shirtButtons.hide(); 
    if($('.color').val() == 'white' || $('.size:checked').val() == 'small'){ 
     shirtButtons.hide(); 
     $('.white-small').show(); 
    }else if($('.color').val() == 'yellow' || $('.size:checked').val() == 'small'){ 
     shirtButtons.hide(); 
     $('.yellow-small').show(); 
    } 
}); 

Answer 1

<input type="radio" class="size" name="size" value="small">Small 
<input type="radio" class="size" name="size" value="medium" checked>Medium 
<input type="radio" class="size" name="size" value="large">Large 

은 그 값을 획득하기 위해 상기 :checked 선택기를 사용
이 는 HTML 코드

<select class="color"> 
    <option value="white">White</option> 
    <option value="yellow">Yellow</option> 
</select> 

<input type="radio" class="size" name="size" value="small">Small 
<input type="radio" class="size" name="size" value="medium" checked>Medium 
<input type="radio" class="size" name="size" value="large">Large 

JS 코드가

$('.size').click(function() { 
    myFunction(); 
}); 

$('select.color').change(function() { 
    myFunction(); 
}); 

function myFunction(){ 
    shirtButtons.hide(); // Don't know what is shirtButtons, please explain 
    var color = $('select :selected').val(); 
    var size = $('.size:checked').val(); 

    if(color == 'white' || size == 'small'){ 
    shirtButtons.hide(); // Don't know what is shirtButtons, please explain 
    $('.white-small').show(); 
    } else if(colort == 'yellow' || size == 'medium'){ 
     shirtButtons.hide(); // Don't know what is shirtButtons, please explain 
     $('.yellow-medium').show(); 
    } 
} 

그래서, 당신은 alert 또는 console.log 변수 color 및 size에 시도 할 수 있습니다 : 여기 당신을 위해 만든 몇 가지 예입니다 .
문제가있는 곳을 알려주십시오.

Answer 2

: 만 흰색 작은

<select class="color"> 
    <option value="white">White</option> 
    <option value="yellow">Yellow</option> 
</select> 
    <input type="radio" class="size" name="size" value="small">Small 
    <input type="radio" class="size" name="size" value="medium" checked>Medium 
    <input type="radio" class="size" name="size" value="large">Large 

노란색 작은 JS를 보여주기 위해 나는 코드를 응축했습니다.

$(".size:checked").val() 

전체 JS

$('.color, .size').click(function() { 
    if($('.color').val() == 'white' || $(".size:checked").val() == 'small'){ 
     shirtButtons.hide(); 
     $('.white-small').show(); 
    }else if($('.color').val() == 'white' || $(".size:checked").val() == 'medium'){ 
     shirtButtons.hide(); 
     $('.white-medium').show(); 
    } //etc 
}); 

JS 바이올린 :http://jsfiddle.net/B93WW/