刷新“aria-pressed”带有标记/样式的 UI 按钮

Question

我正在使用 UI 按钮，样式如下|乙|我|你|在这个示例页面中，生成的 html 结构如下所示：

<div class="radiocheck ui-buttonset">
<input type="radio" name="radio1" value="1" id="radio0" class="ui-helper-hidden-accessible">
<label for="radio0" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button" aria-disabled="false">
    <span class="ui-button-text">Sobre</span>
</label>
<input type="radio" name="radio1" value="2" id="radio1" class="ui-helper-hidden-accessible">
<label for="radio1" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only" role="button" aria-disabled="false">
    <span class="ui-button-text">Politica</span>
</label>
<input type="radio" name="radio1" value="3" id="radio2" class="ui-helper-hidden-accessible">
<label for="radio2" aria-pressed="true" class="ui-button ui-widget ui-state-default ui-button-text-only" role="button" aria-disabled="false">
    <span class="ui-button-text">Outros</span>
</label>
<input type="radio" name="radio1" value="4" id="radio3" class="ui-helper-hidden-accessible">
<label for="radio3" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right" role="button" aria-disabled="false">
    <span class="ui-button-text">Promocoes</span>
</label>

当我将 "aria-pressed" 属性更改为 "true" 时，按钮根本没有改变...我尝试了这种方式，但没有工作： <代码>

var myhappyidtest = 2;


 $('.radiocheck 输入').each(function(i){
    if(myhappyidtest == $(this).val()){
        $(this).next('label').attr('aria-pressed', 'true');
    }
});

我发现在按钮情况下，可以刷新。 但我不知道如何在这种带有标签的情况下做到这一点。

有人有主意吗？

Answer 1

我只需将“ui-state-active”类添加到元素中就可以了！

var myhappyidtest = 2;

$('.radiocheck input').each(function(i){
    if(myhappyidtest == $(this).val()){
        $(this).next('label').attr('aria-pressed', 'true');
        $(this).next('label').addClass('ui-state-active');
    }else{
        $(this).next('label').attr('aria-pressed', 'false');
        $(this).next('label').removeClass('ui-state-active');
    }
});

更新

按照@Gnought和@Vladimir的建议，并使用@Vladimir的方法，这里是这个问题的更新答案：

var myhappyidtest = 2;

$('#format input[value="' + myhappyidtest + '"]').attr('checked', true).button('refresh');

由于示例的原始链接已关闭，我在这里做了一个示例：http://jsfiddle.net/psycocandy/8SpGd/1/

感谢您的建议。

Answer 2

实际上，你应该让 jquery ui 来做样式：

$(this).attr('checked', false);
$(this).button('refresh');