javascript - 如果选择了单选按钮并选择了选择值jquery

Question

更新问题:所以现在我可以让白衬衫工作，但不能让黄色衬衫工作。我可以在白色的小-中-lrg之间切换，但切换到黄色仍然只能在白衬衫尺寸之间变化。我已将代码压缩为仅显示小白色和小黄色

<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() {
    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

您必须向输入添加一个类size。

 <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选择器获取值:

$(".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 fiddle : http://jsfiddle.net/B93WW/