Javascript 选择单选按钮时显示div

我是javascript和jQuery的新手。 在我的html中有两个单选按钮和一个div。如果我选中第一个单选按钮，我想显示该div，但如果我不选中，我想将其隐藏

因此：如果选中“监视我”单选按钮-->div“显示我”可见。 如果单选按钮“监视我”未选中（均未选中或第二个未选中）-->div“显示我”处于隐藏状态

这是我到目前为止所拥有的

 <form id='form-id'>
<input id='watch-me' name='test' type='radio' /> Show Div<br />
<input name='test' type='radio' /><br />
<input name='test' type='radio' />
 </form>
 <div id='show-me' style='display:none'>Hello</div>

---

如何更改脚本以实现这一点？

输入元素应具有值属性。添加它们并使用以下命令：

$("input[name='test']").click(function () {
    $('#show-me').css('display', ($(this).val() === 'a') ? 'block':'none');
});

---

我会这样处理：

$(document).ready(function() {
   $('input[type="radio"]').click(function() {
       if($(this).attr('id') == 'watch-me') {
            $('#show-me').show();           
       }

       else {
            $('#show-me').hide();   
       }
   });
});

---

我想你可以这么快就做<代码>$（'input[type=“radio”]#watch me'）。单击（有趣…如果默认选中单选按钮，则仅代码块无法提供良好的答案。请添加解释（为什么它可以解决问题，错误在哪里等…）

$(document).ready(function() {
   $('input[type="radio"]').click(function() {
       if($(this).attr('id') == 'watch-me') {
            $('#show-me').show();           
       }

       else {
            $('#show-me').hide();   
       }
   });
});

$('input[name=test]').click(function () {
    if (this.id == "watch-me") {
        $("#show-me").show('slow');
    } else {
        $("#show-me").hide('slow');
    }
});

 $('input[type="radio"]').change(function(){
      if($("input[name='group']:checked")){
      $(div).show();
    }
  });

var switchData = $('#show-me');
switchData.hide();
$('input[type="radio"]').change(function(){ var inputData = $(this).attr("value");if(inputData == 'b') { switchData.show();}else{switchData.hide();}});