- 用easyui制作下拉框,默认会展示“valueFiled”空值对应的“textField”。适合用作提示。代码如下:
var data = [
{'text' : '未选择', 'value' : ''},
{'text' : '亚洲', 'value' : '1'},
{'text' : '欧洲', 'value' : '2'},
{'text' : '非洲', 'value' : '3'},
{'text' : '北美洲', 'value' : '4'},
{'text' : '南美洲', 'value' : '5'},
{'text' : '大洋洲', 'value' : '6'},
{'text' : '南极洲', 'value' : '7'}
];
$('#test').combobox({
textField : 'text',
valueField : 'value',
panelHeight : 'auto',
data : data
})
结果如图:
- 如果想默认展示特定的值:
- 方法一,可用”combobox“的”setValue“方法设置特定的值。
var data = [
{'text' : '未选择', 'value' : ''},
{'text' : '亚洲', 'value' : '1'},
{'text' : '欧洲', 'value' : '2'},
{'text' : '非洲', 'value' : '3'},
{'text' : '北美洲', 'value' : '4'},
{'text' : '南美洲', 'value' : '5'},
{'text' : '大洋洲', 'value' : '6'},
{'text' : '南极洲', 'value' : '7'}
];
$('#test').combobox({
textField : 'text',
valueField : 'value',
panelHeight : 'auto',
data : data,
onLoadSuccess : function(){
$('#test').combobox('setValue','6');
}
})
结果如图:
- 方法二,加载的数据里添加“selected : true”。代码如下。
var data = [
{'text' : '未选择', 'value' : ''},
{'text' : '亚洲', 'value' : '1'},
{'text' : '欧洲', 'value' : '2'},
{'text' : '非洲', 'value' : '3'},
{'text' : '北美洲', 'value' : '4','selected':true},
{'text' : '南美洲', 'value' : '5'},
{'text' : '大洋洲', 'value' : '6'},
{'text' : '南极洲', 'value' : '7'}
];
$('#test').combobox({
textField : 'text',
valueField : 'value',
panelHeight : 'auto',
data : data,
})
结果如图:
完整代码见GitHub:
https://github.com/themeth/test/blob/master/easyui-combobox.html