单选按钮不会动态应用样式

时间:2013-03-14 05:02:34

标签: css jquery-mobile radio-button

每次用户访问标签页菜单时,我都会尝试刷新单选按钮列表。第一次访问样式是可以的,但它们的行为类似于复选框,并且在单击其他单选按钮时无法取消选中。

我尝试使用refresh();方法,但它仍无效。

您可以在JSFIDDLE

上看到演示

有什么建议吗?谢谢。

$('.export_tab').click(function(){
    $("#radios_wrapper").children().remove(); //Remove all previous radio buttons
    for(var i in localStorage) //Looping through the localStorage
        {
            dataIndex = JSON.parse(localStorage[i]).index;
            dataName = JSON.parse(localStorage[i]).name;
                    //Then insert a new one
            $("#radios_wrapper").append('<input type="radio" value="'+dataIndex+'" name="'+dataIndex+'" id="radio'+dataIndex+'"/><label for="radio'+dataIndex+'">'+dataName+'</label>');
        }
});

这是HTML

<div data-role="fieldcontain">
     <fieldset data-role="controlgroup" id='radios_wrapper'>

     </fieldset>
</div>

1 个答案:

答案 0 :(得分:0)

Radiobuttons需要相同的名称才能成为一个群组。所以:

'<input type="radio" value="'+dataIndex+'" name="'+dataIndex+'"/>'

不是正确的方法。对于要分组的所有无线电,名称应该相同。它应该是:

'<input type="radio" value="'+dataIndex+'" name="allTheSame"/>'

以下是Fiddle的更新。

告诉jQuery重绘使用像.append('whatever').trigger('create')这样的触发器函数。 http://jquerymobiledictionary.pl/faq.html。更新了Fiddle