當單選按鈕被激活時顯示div

Question

我正在嘗試像already asked question一樣進行操作。 問題：我有40個div要顯示，我不想每行顯示10行代碼...

有沒有關於此主題的任何提示？ Thx傢伙。 :)

Answer 1

試試這個。你只需要用class替換id。

在您的評論。有兩個演示demo1和demo2我想你想要這樣的東西。它顯示了具有選擇的下一個div。如果你想顯示保存div.then變化

var value=$(this).attr('value');到var value=$(this).attr('value')-1;

$(document).ready(function() { 
 
    $('input[type="radio"]').click(function() { 
 
     $('.show-me').hide(); 
 
     var value=$(this).attr('value'); 
 
     $(".show-me:eq("+value+")").show(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<form id='form-id'> 
 
    <input value='1' name='test' type='radio' />radio1 
 
    <input value='2' name='test' type='radio' />radio2 
 
    <input value='3' name='test' type='radio' />radio3 
 
    <input value='4' name='test' type='radio' />radio4 
 
    <input value='5' name='test' type='radio' />radio5<br /> 
 
    <input value='6' name='test' type='radio' />radio6 
 
    <input value='7' name='test' type='radio' />radio7 
 
    <input value='8' name='test' type='radio' />radio8 
 
    <input value='9' name='test' type='radio' />radio9 
 
    <input value='10' name='test' type='radio' />radio10 
 
    
 
</form> 
 
    <div class='show-me' style='display:none'>Div 1</div> 
 
    <div class='show-me' style='display:none'>Div 2</div> 
 
    <div class='show-me' style='display:none'>Div 3</div> 
 
    <div class='show-me' style='display:none'>Div 4</div> 
 
    <div class='show-me' style='display:none'>Div 5</div> 
 
    <div class='show-me' style='display:none'>Div 6</div> 
 
    <div class='show-me' style='display:none'>Div 7</div> 
 
    <div class='show-me' style='display:none'>Div 8</div> 
 
    <div class='show-me' style='display:none'>Div 9</div> 
 
    <div class='show-me' style='display:none'>Div 10</div>