我在jQuery UI的buttonset函数中遇到(间歇性)问题。有时,当我调用它时,它仅将它添加的类应用于容器div和第一个 child ,而有时它却完全按预期工作。 (对不起,我对此不做任何准备,无法在应用程序之外进行。)jQuery UI 1.10.0和1.10.4都存在相同的问题。
即我从这里开始:
<div class="my-buttonset">
<input type="radio" name="option" id="option1">
<label for="option1">Option 1</label>
<input type="radio" name="option" id="option2">
<label for="option2">Option 2</label>
<!-- More elements -->
</div>
并在调用buttonset之后得到此信息(注意单选按钮确实添加了一个不正确的类):
<div class="my-buttonset ui-buttonset">
<input class="ui-corner-left" type="radio" name="option" id="option1">
<label for="option1">Option 1</label>
<input type="radio" name="option" id="option2">
<label for="option2">Option 2</label>
<!-- Other elements unchanged -->
</div>
而不是这样:
<div class="container-fluid-full radio-row mode-radio-row ui-buttonset">
<input class="ui-helper-hidden-accessible" type="radio" name="option" id="option1">
<label class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left ui-state-hover" for="option1" role="button" aria-disabled="false" aria-pressed="false"><span class="ui-button-text">Option 1</span></label>
<input class="ui-helper-hidden-accessible" type="radio" name="option" id="option2">
<label class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left ui-state-hover" for="option2" role="button" aria-disabled="false" aria-pressed="false"><span class="ui-button-text">Option 2</span></label>
<!-- Other elements correct -->
</div>
更新:我可以在我的应用程序中一致地重现此内容。该应用程序使用AngularJS,我有2个使用按钮集的 View ,分别称为“A”和“B”。如果我转到“A”,刷新页面,然后导航到“B”,则总是会发生这种情况。它永远不会以相反的顺序发生,或者如果我从应用程序中的任何其他 View 开始的话。以前,如果我重新创建它,然后导航回“A”,则不会发生这种情况,但是现在,我将其重构为指令,如果刷新为“A”,则看到正确的按钮设置,请转到“B”,我查看困惑的版本,然后导航到“A”,我也看到困惑的版本,它还会影响在“A”上设置的第二个按钮,该按钮不属于指令。
我尝试用两个使用按钮集的 View 在JS Fiddle中重新创建一个基本示例,但这还不足以重新创建该错误。
最佳答案
我为完全相同的问题折磨了大约一天的时间,却没有找到解决方案。
就我而言,问题是使用Bootstrap。
Bootstrap还管理按钮,它使用与Jquery UI相同的名称buttons
。
解决方案(实际上真的很简单,因为找不到)!只需更改页面上的包含顺序:首先Bootstrap.js
,然后再更改jquery-ui...js
。
这个简单的事情解决了这个问题(如果仍然存在冲突的话)。
对于更可靠的解决方案,使用JQuery UI Bridge或put Bootstrap in no conflict mode可能很有用(但是我目前还没有测试过这些解决方案,即使我99%确信它们会解决问题)。
注意:工具提示也存在相同的冲突。
关于javascript - jQuery UI Buttonset不向子元素添加类,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/22824472/