ionic 单选框
ionic 单选按钮与标准 type="radio" 的 input元素类似。以下展示了现代app类型的单选按钮。
每个 item-radio 中的 type="radio" 的 input 元素的 name 属性都相同。radio-icon 类用于是否显示图标。
ionic 在单选项中使用了 <label> 元素,使其更易点击。
实例
<divclass="list"><labelclass="item item-radio"><inputtype="radio"name="group"value="go"checked="checked"><divclass="radio-content"><divclass="item-content">
Go
</div><iclass="radio-icon ion-checkmark"></i></div></label><labelclass="item item-radio"><inputtype="radio"name="group"value="python"><divclass="radio-content"><divclass="item-content">
Python
</div><iclass="radio-icon ion-checkmark"></i></div></label><labelclass="item item-radio"><inputtype="radio"name="group"value="ruby"><divclass="radio-content"><divclass="item-content">
Ruby
</div><iclass="radio-icon ion-checkmark"></i></div></label><labelclass="item item-radio"><inputtype="radio"name="group"value=".net"><divclass="radio-content"><divclass="item-content">
.Net
</div><iclass="radio-icon ion-checkmark"></i></div></label><labelclass="item item-radio"><inputtype="radio"name="group"value="java"><divclass="radio-content"><divclass="item-content">
Java
</div><iclass="radio-icon ion-checkmark"></i></div></label><labelclass="item item-radio"><inputtype="radio"name="group"value="php"><divclass="radio-content"><divclass="item-content">
PHP
</div><iclass="radio-icon ion-checkmark"></i></div></label></div>
尝试一下 »
运行效果如下: