checkbox互斥选择 兼容ie edge 360 搜狐
需要三个input选项都是可以独立选择的也就是checkbox，但是需要选了Ring Light就不能选Tablet Holder，这俩不能一起选，现在我换成了radio后变成这俩一定要选一个没得取消了，怎么改呢，不影响图片切换，需要兼容ie edge 360 搜狐
<form id="option-lapmoni" class="slidebox-right">
<div class="optionrow columngz">
<div class="optionbox shubox">
<input type="radio" name="yon" id="lightyon" class="optioninput"
value="light" onclick="set2Src()">
<div class="productbox">
<p class="productbox-p1"></p>
<p class="productbox-p2">Ring Light</p>
<p class="productbox-p3"></p>
</div>
</div>
<div class="optionbox shubox">
<input type="radio" name="yon" id="tabletyon" class="optioninput"
value="tablet" onclick="set2Src()">
<div class="productbox">
<p class="productbox-p1"></p>
<p class="productbox-p2">Tablet Holder</p>
<p class="productbox-p3"></p>
</div>
</div>
<div class="optionbox shubox">
<input type="checkbox" name="yon" id="microyon" class="optioninput"
value="micro" onclick="set2Src()">
<div class="productbox">
<p class="productbox-p1"></p>
<p class="productbox-p2">Microphone Mount</p>
<p class="productbox-p3"></p>
</div>
</div>
</div>
<div class="step1btbox">
<botton id="step2-back" class="custombtn2">back</botton>
<botton id="step2-next" class="custombtn" onclick="step2next()">NEXT</botton>
</div>
</form>
<script>
var kv2ImgSrc = {
light: '',
tablet: '',
micro: '',
lighttablet: '',
lighttabletmicro:'',
lightmicro: '',
tabletmicro: '',
'':''
}
function set2Src() {
var key = $('#option-lapmoni .optioninput:checked').map(function () { return this.value }).get().join('');
$('#lapmoni-img').attr("src", kv2ImgSrc[key]);
var step2option1 = $("input[id='lightyon']:checked").val();
var step2option2 = $("input[id='tabletyon']:checked").val();
var step2option3 = $("input[id='microyon']:checked").val();
$('#product-light')[step2option1 == "light" ? 'show' : 'hide']();
$('#product-pad')[step2option2 == "tablet" ? 'show' : 'hide']();
$('#product-micro')[step2option3 == "micro" ? 'show' : 'hide']();
return false;
}
</script>
