当使用自定义图像单选按钮时，使单选按钮成为必需的

Make radio button required, when using a custom image radio button

本文关键字：单选按钮 自定义 图像      更新时间：2023-09-26

我的问题是，我使用自定义图像为我的单选按钮，所以我有他们设置为显示:none;但是这样做意味着它们不再按需要被调用。

有一个简单的解决方案吗?单选按钮必须是图像。

-谢谢

<label for="topsides">Top Sides</label>
<form action="" id="TopSideYearCubics_id">
<input class="radio" id="topsidescubicsides" type="radio" name="properties[Top Sides]" value="Cubic Sides" required="required">
<a id="topsidescubicsides_button" href="javascript:set_radio('topsidescubicsides');" class="radio-picture-150x150"  style="background: url(http://www.xxxx.com/_Store/_images2015/customring_buttons/button_CA01test_topsides_cubics.gif) no-repeat scroll 0 0;">&nbsp;</a>
<input class="radio" id="topsidesyearsides" type="radio" name="properties[Top Sides]" value="Year Sides">
<a id="topsidesyearsides_button" href="javascript:set_radio('topsidesyearsides');" class="radio-picture-150x150" style="background: url(http://www.xxxx.com/_Store/_images2015/customring_buttons/button_CA01test_topsides_years.gif) no-repeat scroll 0 0;">&nbsp;</a>
</form>
      <br />

<script>
  <!-- //## Sets the Image to the Radio Button ##//-->
function set_radio($inputid) {
$("input#" + $inputid).click();
}
$(document).ready(function() {
    $("a.radio-picture-150x150").click(function(){
        var $id = $(this).attr('id');
        $("a.radio-picture-150x150").removeClass('selected-border');
        $("a#" + $id).addClass('selected-border');
    });
});
</script>
<style>
input[type=radio], input[type=checkbox] {
display:none;
}
</style>

在我的CSS中，我只是给input[type="radio"]一个opacity:0;的样式，以摆脱库存按钮，但仍然显示浏览器的"请选择这些选项之一"验证工具提示，当我的自定义无线电图像之一没有被选中

相关文章：