优秀的编程知识分享平台

网站首页 > 技术文章 正文

ionic 单选框(单选框选中后触发的方法)

nanyue 2024-09-29 15:11:01 技术文章 69 ℃

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>

最近发表
标签列表