0

私のコードがあります

<input type="radio" name="category" id="elementary" value="elementary" /> 1
<input type="radio" name="category" id="junior" value="junior" /> 2
<input type="radio" name="category" id="senior" value="senior" /> 3
<input type="radio" name="category" id="university" value="university" /> 4
<input type="radio" name="category" id="profession"/> 5

<div id='grade_select' class="clearfix">
  <div id='elementary_grade' class="clearfix"></div>
  <div id='junior_grade' class="clearfix"></div>
  <div id='senior_grade' class="clearfix"></div>
  <div id='university_grade' class="clearfix"></div>
  <div id='profession_grade' class="clearfix"></div>
</div>

私が欲しい:

1 つのラジオをチェックする場合、grade_select ですべての div を非表示にしてから、現在のラジオ値を含む id の div を表示する必要があります

私のjsコードがありますが、どうすればいいのかわかりません

   <script type="text/javascript">
    $(document).ready(function($){
      $( "input[name='category']" ).bind( "click", category_select)
    });
    function category_select(){
        $("div:[id=this.attr[id]]).show()
    }
    </script>

参考:この質問は、この他の質問のスピンオフです。

4

6 に答える 6

4
<script type="text/javascript">
    $(document).ready(function($){
        $( "input[name='category']" ).bind( "click", function() {
            $("#grade_select div").hide().parent().find( '#' + this.id + "_grade" ).show();
        });
    });
</script>
于 2012-05-20T08:47:52.010 に答える
2

試す:

$("input[name='category']").click(function(){
    var id = $(this).attr('id');
    $("div#grade_select > div").hide();
    $("#" + id + "_grade").show();  
});​

デモ

于 2012-05-20T08:49:19.723 に答える
1
$("input[name='category']").click(function(){
    $("#grade_select div").hide().filter('#' + this.id + '_grade').show();
});

ライブデモ

于 2012-05-20T08:50:40.233 に答える
0

最初に ID を保持する変数を作成し、それをセレクターとして使用できます。

function category_select() {
     var $this = $(this),
     id = '#' + $this.attr('id') + '_grade'; // calculate ID of element to show

     $('#grade_select')
         .children() // select all children
         .hide() // hide all children
         .filter(id) // select the right one
         .show(); // and show it
}
于 2012-05-20T08:49:54.447 に答える
0

セレクター#grade_select > divを使用して直接の子であるすべての div を非表示にし (必要に応じて他の div を内部に含めることができるように)、表示するものをフィルターで除外します。

$(document).ready(function($){
  $("input[name=category]").click(function(){
    $("#grade_select > div").hide().filter("#" + this.id + "_grade").show();
  });
});
于 2012-05-20T08:50:09.427 に答える
0

デモ

jqueryコード

$("input[type='radio']").click(function() {
    $("#grade_select div").hide();
    $("#" + this.id + "_grade").show();
});​
于 2012-05-20T08:53:39.300 に答える