2012-05-04 2 views
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> 

Мне нужно, чтобы показать каждый Див только при нажатии на соответствующую кнопку, в противном случае она должна быть скрыта .right теперь я написал javascript, но он работает неправильно.

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

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

    }); 


}); 

Это было написано тест т, может ли selltab быть показаны при нажатии кнопки радио ценностного продавать ... Но, кажется, есть какая-то ошибка, где некоторые ...

+0

проверить мой ответ в ответ на ваше требование: «Мне нужно, чтобы показать каждый Див только при нажатии на соответствующую кнопку, иначе она должна быть скрыта» – jazzytomato

ответ

3

С помощью переключателя функции, которую вы может сделать это.

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

$('input[name=sell]').click(function(){ 
    $('#selltab').toggle(); 
}) 
$('input[name=rent]').click(function(){ 
    $('#renttab').toggle(); 
}) 
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(); 
}); 
​ 

​ 
Смежные вопросы