2012-05-04 3 views
0

J'ai un code Html en tant que telAffichage div sur un clic de bouton radio uniquement

 <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> 

Je dois montrer à chaque div que tout en cliquant sur le bouton correspondant, sinon il doit être caché .Right maintenant j'ai écrit une javascript, mais cela ne fonctionne pas correctement.

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

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

    }); 


}); 

Ce test écrit a été t si selltab peut être affiché en cliquant sur le bouton radio de la vente de la valeur ... Mais semble avoir une erreur quelque part ...

+0

vérifier ma réponse en réponse à une demande: « Je dois montrer à chaque div que tout en cliquant sur le bouton correspondant, sinon il doit être caché » – jazzytomato

Répondre

3

en utilisant la fonction vous à bascule peut le faire.

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

$('input[name=sell]').click(function(){ 
    $('#selltab').toggle(); 
}) 
$('input[name=rent]').click(function(){ 
    $('#renttab').toggle(); 
}) 
2

Je pense que c'est ce que vous voulez: 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(); 
}); 
​ 

​ 
Questions connexes