前端之家收集整理的这篇文章主要介绍了
dojo小例子(9)动态创建带label的CheckBox集合,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
/**
* 循环创建带label的CheckBox集合
*/
require(["dijit/form/CheckBox","dojo/dom-construct","dojo/domReady!"],function(CheckBox,domConstruct){
// 创建数据
var data_list = [
{ col1: "normal",col2: false,col4: 29.91},{ col1: "important",col4: 9.33},{ col1: "very",col4: 19.34}
];
for( i = 0; i < data_list.length; i++ )
{
var item = data_list[i];
// CheckBox
var BoxOne = new CheckBox({
name: "types"
});
// 放到指定html标签
BoxOne.placeAt('childDocLib');
// 根据数据的值设置CheckBox title、value属性
BoxOne.set('title',item.col4);
BoxOne.set('value',item.col4+''); // 不加''会取不到值
if( i == 2 )
{
// 选中
BoxOne.set('checked',true);
}else
{
BoxOne.set('checked',false);
}
// 因为checkBox自带label不起作用,又想在checkBox后显示文字,所以通过这种方法添加label标签实现
childDocLib.appendChild(domConstruct.create("label",{innerHTML: item.col4}));
}
});
<table>
<tr>
<td id="childDocLib"></td>
</tr>
</table>