переключатель скрывать и показывать Div JQuery

Question

У меня есть переключатель с двумя возможными значениями: да или нет.Я хотел бы, чтобы когда пользователь нажимал yes, появлялся div, а когда no скрывался div.

Мой код есть, но он не работает:

<script type="text/javascript">
                   $(document).ready(function() {
                   $("div.desc").hide();
                   $("input[name$='pain']").click(function() {
                   var test = $(this).val();
                   $("div.desc").hide();
                  $("#" + test).show();
                    });
                  });
               </script>

         <div id="fieldsetInner">
               <fieldset class="rightInner">
               <legend>pain</legend>
               <label for="pain" class="label2">do you feel pain ; </label>
               <input name="pain" type="radio" value="yes" id="yes" checked="checked"/> Yes  &nbsp;
               <input name="pain" type="radio" value="no"/> No

               <div id="yes" class="desc">
                <label for="pain-feature1-morph" class="label2">Morph : </label>
               </div>
          </div>

Заранее спасибо

Answer 1

Я надеюсь, что это поможет вам

   <input name="pain" type="radio" value="yes" id="yes"/> Yes
    <input name="pain" type="radio" value="no" id="no" /> No


    $('input:radio[name=pain]').click(function() {
         if ($('#yes').attr('checked')) {
             $('.desc').show();
           } else if ($('#no').attr('checked')) {
             $('.desc').hide();
          }

        });

Answer 2

вы могли бы сделать

$("input#yes").click(function() {
    $("div.desc").show();
});
$("input#no").click(function() {
    $("div.desc").show();
});

Answer 3

У вас есть дубликат id в вашем HTML, и div, который вы пытаетесь показать, и переключатель «yes» имеют идентификатор «yes». Идентификаторы должны быть уникальными в документе.

Как только вы исправили свой HTML, это должно сработать -

$(document).ready(function() {
    $("input[name$='pain']").change(function() {
        var test = $(this).val();
        $("div.desc").hide();
        if ($("div#" + test).length > 0) $("div#" + test).show();
    })
});

Демо - http://jsfiddle.net/mSLeA/