2011-04-12 49 views
2

我使用的UI buttons with style - Like | B | I | U | in this example page,和HTML结构生成这个样子:刷新“咏叹调压”与标记UI按键/类型

<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> 

当我改变“咏叹调-pressed” propertie到‘真’,按钮不会改变在所有...我tryed这种方式,但它没有工作:

 
var myhappyidtest = 2;

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

我看到ŧ帽子在按钮的情况下,有可能刷新。 但我不知道如何在这种情况下使用标签来做到这一点。

有人有想法吗?

+0

我认为咏叹调属性是专门为辅助技术来帮助传达信息,以禁用的用户。我不相信它对按钮的外观有任何影响。 – clamchoda 2011-04-12 20:58:05

+0

谢谢克里斯!我找到了解决方案......非常简单! =)我只是将** ui-state-active **类添加到元素,然后将** aria-pressed **设置为** true **并且它可以工作! – 2011-04-13 11:23:25

+0

不是问题,快乐编码;) – clamchoda 2011-04-13 14:40:03

回答

5

我只是将“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'); 
    } 
}); 

UPDATE

至于建议的@Gnought和@Vladimir,并使用@Vladimir的方法,这里是一个更新的回答这个问题:

var myhappyidtest = 2; 

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

由于原文链接的例子是关闭的,我在这里做了一个例子:http://jsfiddle.net/psycocandy/8SpGd/1/

谢谢你的建议。

+1

咏叹调和UI状态活动受JQuery内部变化。我认为这种方法不被推荐。 – Gnought 2014-07-16 07:47:44

2

其实,你应该让jQuery用户界面做的造型:

$(this).attr('checked', false); 
$(this).button('refresh'); 
相关问题