[英]If radio button is selected and select value is selected jquery
Updating issue: So now i can get the white shirts to work but not yellow. 更新中的问题:所以现在我可以让白衬衫工作了,但黄色却不能。 I can switch between small-med-lrg on white, but swapping to yellow still only changes between white shirt sizes.
我可以在白色的Small-med-lrg之间切换,但是换成黄色仍然只能在白色衬衫尺寸之间变化。 I've condensed code to only show small white and small yellow
我压缩了代码,只显示白色和黄色
<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
and js: 和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();
}
});
You must add a class size
to the inputs. 您必须将类
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
Then use the :checked
selector to obtain the value: 然后使用
:checked
选择器获取值:
$(".size:checked").val()
Full JS 全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/ JS小提琴: http : //jsfiddle.net/B93WW/
Here is some example I have created for you: 这是我为您创建的一些示例:
HTML code
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 code
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();
}
}
So, you can try to alert
or console.log
the variables color
and size
. 因此,您可以尝试
alert
或console.log
变量color
和size
。
Please let me know where you have the problems. 请让我知道您遇到的问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.