Javascript 双击required可输出单选按钮选择

我有一个基于单选按钮选择输出结果的表单。表单有多个单选按钮，根据选择将显示相关div并隐藏不相关的div

就功能而言，它工作得非常好。问题在于，为了输出结果（一旦您选择了单选按钮），您必须按两次提交按钮

这是我的密码：

（函数（$）{
$（“#测验_提交”）。单击（函数（）{
$（“#测验_提交”）。单击（函数（）{
让checkedId=$（'input[type=radio][name=quick selector]：checked'）.attr（'id'））
如果（检查EDID==“选项一”）{
$（'.a1'）.show（）；
$（'.a2，.a3'）.hide（）；
}else if（checkedd==“选项二”）{
$（'.a2'）.show（）；
$（'.a1，.a3'）.hide（）；
}否则如果（检查EDID==“选项三”）{
$（'.a3'）.show（）；
$（'.a1，.a2'）.hide（）；
}
});
});
})（jQuery）
.re-quick\uu内部{
最大宽度：1000px；
保证金：0自动；
}
.问答部分{
浮动：左；
宽度：计算（50%-10px）；
利润上限：-60px；
右边距：20px；
背景色：#C1C1；
填充：40px 40px；
盒子阴影：10px20px36px0rgba（0,0,0,0.2），010px40px0rgba（0,0,0,0.19）！重要；
}
.slider___段{
浮动：左；
宽度：计算（50%-10px）；
}
.type_uu测验{
宽度：50px；
保证金：0自动；
填充：0px 0px 10px 0px；
边框底部：1px纯白；
文本对齐：居中；
颜色：#FFF；
}
.测验题目{
颜色：#FFF；
字号：2em；
文本对齐：居中；
宽度：400px；
保证金：20px自动40px自动；
}
.测验表格{
颜色：#FFF；
边缘底部：20px；
浮动：左；
宽度：100%；
}
.测验项目{
颜色：#FFF；
显示：块；
位置：相对位置；
浮动：左；
宽度：100%；
边缘底部：10px；
字体大小：14px；
线高：25px；
}
.测验项目输入[类型=收音机]{
位置：绝对位置；
可见性：隐藏；
}
.测验项目标签{
显示：块；
位置：相对位置；
字体大小：300；
字号：1.35em；
填充：25px 0px 25px 50px；
利润率：10px自动；
高度：30px；
z指数：9；
光标：指针；
-webkit转换：所有0.25s线性；
}
.测验项目：悬停标签{
颜色：#FFFFFF；
}
.测验项目.检查{
显示：块；
位置：绝对位置；
边框：5px实心#FFF；
边界半径：100%；
高度：32px；
宽度：32px；
顶部：30px；
左：0px；
z指数：5；
过渡：边界.25s线性；
-webkit过渡：边界.25s线性；
}
.测验项目：悬停。检查{
边框：4px实心#FFFFFF；
}
.测验项目.检查：：之前{
显示：块；
位置：绝对位置；
内容：''；
边界半径：100%；
高度：15px；
宽度：15px；
顶部：5px；
左：5px；
保证金：自动；
过渡：背景0.25s线性；
-webkit过渡：背景0.25s线性；
}
输入[类型=收音机]：选中~。选中{
边框：4px实心#fff000；
}
输入[类型=收音机]：选中~。选中：：之前{
背景#fff000；
}
输入[类型=收音机]：选中~标签{
颜色：#EE78A5；
}
#提交测验{
显示：块；
字体大小：16px；
字体大小：400；
文本转换：大写；
背景#fff000；
颜色：#FFF；
宽度：160px；
线高：40px；
保证金：20px自动；
}
.a1，
.a2，
.a3{
显示：无；
颜色：#FFF；
}

测验的问题



1号加油站


2号加油站


3号加油站


问题的答案-一
问题解答-二
问题的答案-三
您使用的是另一个内部的事件侦听器，因此第一个侦听器会在第一次单击时附加第二个侦听器，之后您只会使用第二个侦听器。请尝试以下方法：

(function($) {
    $('#quiz_submit').click(function() {
      let checkedId = $('input[type=radio][name=quiz-selector]:checked').attr('id')
      if (checkedId == "option-one") {
        $('.a1').show();
        $('.a2, .a3').hide();
      } else if (checkedId == "option-two") {
        $('.a2').show();
        $('.a1, .a3').hide();
      } else if (checkedId == "option-three") {
        $('.a3').show();
        $('.a1, .a2').hide();
      }
    });
})(jQuery);