-1

我们都知道单选按钮组（同名单选按钮）中只能选择一个，但我的应用需要根据所选单选按钮显示/隐藏块中的内容（块中可能有嵌套元素）。

问题：如何使用jQuery创建算法，该算法会在选择“广播”按钮时在块中显示内容并在选择不同的广播按钮时隐藏该内容？

算法：radio1、radio2、...和radioN中的任何一个被选中，Flip(classname,id)需要使传入的classname中的所有元素可见&值重置，并且除了传入的id之外的所有元素不可见。

<script type="text/javascript">
  function Flip(classname,id) {
    //this javascript function will make 
    //    1) id of the given classname visible, 
    //    2) and reset & invisible all the rest (all div elements of the given classname except id invisible

}

</script>
</head>
<body>
Requestor:<input type="radio" name="Req" onclick="Flip('RadioClass','radioDIV1');" /><br />
<div class="RadioClass" id="radioDIV1" style="display:none;" >
    Requestor 1234:
    <div >
        decendant level1a:
    </div>
</div>
Submitter:<input type="radio" name="Req" onclick="Flip('RadioClass','radioDIV2');" /><br />
<div class="RadioClass" id="radioDIV2" style="display:none;">
    Submitter 567:
    <div >
        decendant level1b:
    </div>
</div>
ForInfo:<input type="radio" name="Req" onclick="Flip('RadioClass','radioDIV3');" /><br />
<div class="RadioClass" id="radioDIV3" style="display:none;" >
    ForInfo 89:
</div>
</body>
4

1 回答 1

1

这是一个小提琴，它在选择单选按钮时显示和隐藏面板。

我只实现了两个单选按钮而不是 3 ;-)

的HTML...

<body>
    <div>Requestor:<input type="radio" name="Req"/>
        <div class="RadioClass" id="radioDIV1" style="display:none;">
            Requestor 1234:
            <div >
                decendant level1a:
            </div>
        </div>
    </div>

    <div>Submitter:<input type="radio" name="Req"/>
        <div class="RadioClass" id="radioDIV2" style="display:none;">
            Submitter 567:
            <div >
                decendant level1b:
            </div>
        </div>
    </div>
</body>​

以及使用 jQuery 的 JavaScript 代码...

$("input").change(function() {
    $(".RadioClass").hide();
    $(this).next("div").toggle()
});​
于 2012-07-11T19:30:07.213 回答