0

我在我目前正在处理的程序中遇到了一些障碍。在问了最后一个问题之后，我几乎可以完成整个事情，直到这一点。我试图做的是不必创建多个 div 来让我的代码工作（它会这样工作，但我宁愿减少代码量）只是使用一个 div 来显示我想要的它显示。例如，这是我正在尝试做的示例的 jfiddle。

http://jsfiddle.net/vcq9L/

这是我正在使用的 HTML 示例

<input name="search_fields" type="radio" onclick="showtest(0)" /> Test

<div id="test0">
Test 0<p></p>
<input name="search_fields" type="radio" onclick="showtest(1)" />Test 1
<input name="search_fields" type="radio" onclick="showtest(2)" />Test 2
<input name="search_fields" type="radio" onclick="showtest(3)" />Test 3
<p></p>
</div>

<div id="test1">
Test 1<p></p>
<input name="search_fields" type="radio" onclick="showtest(4)" />One
<input name="search_fields" type="radio" onclick="showtest(4)" />Two
<p></p>
</div>

<div id="test2">
Test 2<p></p>
<input name="search_fields" type="radio" onclick="showtest(4)" />One
<input name="search_fields" type="radio" onclick="showtest(4)" />Two
<p></p>
</div>

<div id="test3">
Test 3<p></p>
<input name="search_fields" type="radio" onclick="showtest(4)" />One
<input name="search_fields" type="radio" onclick="showtest(4)" />Two
<p></p>
</div>

<div id="test4">
    Test
</div>

这是js

function showtest(test){
    $('[id^="test"]').hide();
    if(test >= 0){
        $('#test0').show();     
    }
    if(test === 4){
        $('#test1').show();
        $('#test2').hide();
        $('#test3').hide();
    }
    $('#test' + test).show('slow');
}

当您运行 jfiddle 时，第一个单选按钮如何向下运行并显示最终的测试 div，如果这有意义的话，我希望它对所有人都适用。最好将数据放入一个数组中，然后在 js 中调用该数组，以便它也显示我想要的方式，还是比这更简单？

4

0 回答 0