如何使用jquery mobile通过API创建单选按钮水平列表

Question

我一直在试图创建一个水平单选按钮水平列表，但不知何故，我无法获得与完成data- *属性相同的可视化结果。

如果我用代码来做，我会得到方形的按钮，而使用属性时，我会得到一个漂亮的圆角工具栏。

这里是我用来创建按钮列表的代码：

$(element).controlgroup({ mini: true, type: "horizontal" }); 

这应该是一样的一个我的数据 - *属性使用：

<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true"> 

我已经张贴的jsfiddle显示结果

http://jsfiddle.net/simonech/zeDt4/3/

可有人鲥鱼这种奇怪的行为的一些光？ THX 西蒙娜

Answer 1

，使它们看起来一样，试试这个：

$("#mycontrolbox").controlgroup({ mini: true, type: "horizontal"}); 
$("#mycontrolbox").attr("data-role", "controlgroup"); 

更新的jsfiddle - http://jsfiddle.net/zeDt4/4/

现在，这是为什么。

我认为，jQuery手机实际上不是建立在jQuery UI上，即使它目前非常接近。 jQuery mobile正在使用这些数据 - **属性来选择每个标签的作用。当元素被添加到html中时，jqm读取内容并基于这些数据角色属性中的内容，它用自己的内容来修饰/替换当前内容。这更多的是关于元素的外观。

在另一方面，当你调用

$("#mycontrolbox").controlgroup(); 

这并创建一个jQuery组件使您可以使用该组件的方法。等等。 这与从脚本角度来看组件的行为很接近。这不，但是，添加数据角色属性的元素本身。