jQueryUI:当使用多个按钮集(单选按钮)时，它们会忘记自己的状态

Question

我正在用两个不同的按钮集编写一个表单。一旦其中一个被点击，另一个就不再显示它被检查了：

<script type="text/javascript">

    $(document).ready(function() {
        $( "#mode" ).buttonset();
    $( "#language" ).buttonset();
    });

</script>
<div id="language">
    <input type="radio" id="lang_de" name="mode" checked="checked" value="de" /><label for="lang_de">deutsch</label>
    <input type="radio" id="lang_en" name="mode" value="en" /><label for="lang_en">englisch</label>
</div>
<div id="mode">
    <input type="radio" id="mode1" name="mode" checked="checked" value="html" /><label for="mode1">Mail-Output</label>
    <input type="radio" id="mode2" name="mode" value="source" /><label for="mode2">Mail-Sourcecode</label>
</div>

单击后，另一个不再被选中。。或者至少它没有显示为选中。有没有其他人对这个问题感到困惑？

干杯

Answer 1

两个按钮集都使用了name="mode"。这就造成了一个问题。更改任意集合的name属性，然后进行测试。例如：

<div id="language">
    <input type="radio" id="lang_de" name="mode" checked="checked" value="de" /><label for="lang_de">deutsch</label>
    <input type="radio" id="lang_en" name="mode" value="en" /><label for="lang_en">englisch</label>
</div>
<div id="mode">
    <input type="radio" id="mode1" name="mode_next" checked="checked" value="html" /><label for="mode1">Mail-Output</label>
    <input type="radio" id="mode2" name="mode_next" value="source" /><label for="mode2">Mail-Sourcecode</label>
</div>