logo

iMAG移动应用开发指南

Radios

表单单选按钮组

标签

标签名 描述 说明 子标签
radios 表单单选按钮组标签 用于选取单个值 item

属性

属性名 取值 描述
id 文本 id编码
style 样式
radios样式,包括:
name
文本
表单项名称
remember Boolean 表单提交时是否记住value
true:记住value
false:不记住value,默认值
disabled Boolean 禁用状态
true:禁用状态
false:非禁用状态,默认值
items Array 得到RadiosItem的数组。只读属性,仅在Javascript中使用
length Integer >= 0 得到RadiosItem的个数。只读属性,仅在Javascript中使用
checkedIndex Integer >= 0 选中项的序号。仅在Javascript中使用
onclick Javascript 点击时触发的脚本
onchange Javascript 内容改变时触发的脚本
onfocus Javascript 获得焦点时触发的脚本
onblur Javascript 失去焦点时触发的脚本

方法

方法名 参数 返回值 描述
css(name:String) name:样式名称 String 根据样式名称得到样式的值
css(name:String, value:String)
name:样式名称
value:样式值
None 设置单个样式
css(style:String) style:样式文本,多个样式用分号分隔 None 设置多个样式
css(style:Object) style:样式对象,键值对形式 None 设置多个样式
add(item:RadiosItem) item:选项 None 添加一个RadiosItem
remove(index:Integer) index:item的序号 None 删除一个RadiosItem
clear() None None 清空所有RadiosItem

RadiosItem

单选按钮组选项

标签

标签名 描述 说明
item 单选按钮组选项标签 radios的子标签

属性

属性名 取值 描述
style 样式
item样式,包括:
value String 表单项的值
text String 表单项显示的文本
checked Boolean 选中状态
true:已选中
false:未选中,默认值

控件详解

● 单选按钮组

<radios id="test_radios" name="sex">
    <item value="male">男</item>
    <item value="female">女</item>
</radios>

● 单选按钮组选中项

<radios id="test_radios" name="sex">
    <item value="male">男</item>
    <item value="female" checked="true">女</item>
</radios>

● 设置单选按钮组颜色

<radios id="test_radios" name="sex" style="tint-color:red">
    <item value="male">男</item>
    <item value="female" checked="true">女</item>
</radios>

通过tint-color样式设置单选按钮组的颜色

● 禁用单选按钮组

<radios id="test_radios" name="sex" disabled="true">
    <item value="male">男</item>
    <item value="female">女</item>
</radios>

● 修改单选按钮组的值

$('test_radios').value = 'female';

通过设置value来切换不同的item

● 隐藏单选按钮组

$('test_radios').css('display', 'none');
$('test_radios').css('display', 'hidden');

● 显示单选按钮

$('test_radios').css('display', 'block');

● 单选按钮组改变事件

<radios name="sex" onchange="hint(this.value)">
    <item value="male">男</item>
    <item value="female">女</item>
</radios>

设置onchange事件

● 创建单选按钮组

 var radios = $C('<radios name="sex">' +
                  '<item value="male">男</item>' +
                  '<item value="female">女</item>' +
              '</radios>');
 $('test_row').add(radios);

示例下载

点此下载radios相关的示例代码:imag-radios.zip