0

私はそのようなHTMLコードを持っています

      <li>
            <ul>
               <li id="6"><input type="radio" name="sell" value="sell" id="sell" />Sell</li>
               <li id="7"><input type="radio" name="rent" value="rent" id="rent" />Rent</li>
       <li id="8"><input type="radio" name="donate" value="donate" id="donate" />Donate</li>
             </ul>


            <div id="selltab" style="display:none;">
       eeeeeeeee
    </div>
    <div id="renttab" style="display:none;">
       ffffffffff
    </div>
       <div id="donatetab" style="display:none;">
       ggggggggg
       </div>

 </li>

対応するラジオボタンをクリックしている間だけ各divを表示する必要があります。そうでない場合は非表示にする必要があります。今はJavaScriptを記述していますが、正しく機能していません。

     $(document).ready(function(){
    $("radio[@name='sell']").click(function(){

        if ($("radio[@name='sell']:checked").val() == 'sell')
            $("#selltab").css("display","block");

    });


});

これは、値の販売のラジオボタンをクリックしたときにselltabが表示されるかどうかをテストするために作成されました...しかし、どこかで間違いがあるようです...

4

2 に答える 2

3

トグル機能を使用することにより、それを行うことができます。

$('#selltab').hide();
$('#renttab').hide();

$('input[name=sell]').click(function(){
   $('#selltab').toggle();
})
$('input[name=rent]').click(function(){
    $('#renttab').toggle();
})
于 2012-05-04T11:41:32.413 に答える
2

私はこれがあなたが望むものだと思います:http://jsfiddle.net/Wsg3q/

<form>
  <input type="radio" name="group" value="sell" id="sell" /> sell <br/>
  <input type="radio" name="group" value="rent" id="rent" /> rent <br/>
  <input type="radio" name="group" value="donate" id="donate" /> donate <br/>
</form>

<div id="selltab" >
   eeeeeeeee
</div>
<div id="renttab" >
   ffffffffff
</div>
<div id="donatetab" >
   ggggggggg
</div>

Javascript:

$('div').hide();

$("input[name=group]:radio").change(function() {
     $( '#' + $(this).attr('id') + 'tab' ).show();
    $('div:not(#' + $(this).attr('id') + 'tab)' ).hide();
});
​

​
于 2012-05-04T11:30:37.223 に答える