通过无线电是/否选择按ID检查或取消选中所有无线电输入

时间:2017-07-07 05:16:11

标签: javascript jquery html

我的问题是我无法编辑表单代码输出,因此想要根据是否选择了不同的单选按钮来定位无线电ID来检查或取消选中。这有可能吗? - 我可以在标签上添加函数调用或使用jquery - 但我无法像添加onclick事件那样编辑表单代码。

伪代码将是:

If #unsubYes is checked Then
uncheck #option1Yes + #option2Yes AND
check #option1No + #option2No

If #unsubNo is checked Then
uncheck #option1No + #option2No AND
check #option1Yes + #option2Yes

Link to JS fiddle html

任何帮助表示感谢。

干杯, 克里斯

2 个答案:

答案 0 :(得分:1)

$("[name='unsub']").on('change', function(){
    var val = $(this).val();
    var reverseVal = (val == 'Yes' ? 'No' : 'Yes')
    $("input[value='"+reverseVal+"']:not([name='unsub'])").prop('checked', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<span>Option 1</span><br />
<label>
  <input type="radio" name="option1" id="option1Yes" value="Yes">
  Yes
</label>
<label>
  <input type="radio" name="option1" id="option1No" value="No">
  No
</label>
<br /><br />
<span>Option 2</span><br />
<label>
  <input type="radio" name="option2" id="option2Yes" value="Yes">
  Yes
</label>
<label>
  <input type="radio" name="option2" id="option2No" value="No">
  No
</label>
<hr />
<span>Unsubscribe from all</span><br />
<label>
  <input type="radio" name="unsub" id="unsubYes" value="Yes">
  Yes
</label>
<label>
  <input type="radio" name="unsub" id="unsubNo" value="No">
  No
</label>
<br /><br />
<input type="submit" value="submit">
</form>

答案 1 :(得分:0)

当然可以。 你可以做类似这样的事情

document.querySelector('#unsubYes').addEventListener('change', function() {
    if (this.checked) {
        // do something if is checked
    } else {
        // do other thins
    }
});