EasyUI单选,多选,下拉框
程序员文章站
2022-07-13 23:03:03
...
单选框
<div>
<label for="name">性别:</label>
<input type="radio" class="sex" name="sex" value="男">男
<input type="radio" class="sex" name="sex" value="女">女
</div>
单选框设置值
if(row.ssex=='男'){
$('.sex').eq(0).prop({checked:'checked'});
}else{
$('.sex').eq(1).prop({checked:'checked'});
}
多选框
<div>
<label for="name">爱好:</label>
<input type="checkbox" class="shob" name="hob" value="游泳">游泳
<input type="checkbox" class="shob" name="hob" value="羽毛球">羽毛球
<input type="checkbox" class="shob" name="hob" value="篮球">篮球
</div>
多选框设置值
//根据逗号把字符串分割成数组
var hobs = row.shob.split(',');
for(var i=0;i<hobs.length;i++){
if(hobs[i]=='游泳'){
$('.shob').eq(0).attr({checked:'checked'});
}else if(hobs[i]== '羽毛球'){
$('.shob').eq(1).attr({checked:'checked'});
}else{
$('.shob').eq(2).attr({checked:'checked'});
}
}
下拉框
<div>
<label for="name">班级:</label>
<input id="cc" name="mycla">
</div>
<script type="text/javascript">
$('#cc').combobox({
url:'cla_find',
valueField:'cid',
textField:'cname'
});
</script>
时间框
时间控件
<input id="begintime" class="easyui-datebox" data-options="formatter:myformatter,parser:myparser"></input>
//时间格式化
function myformatter(date){
var y = date.getFullYear();
var m = date.getMonth()+1;
var d = date.getDate();
return y+'-'+(m<10?('0'+m):m)+'-'+(d<10?('0'+d):d);
}
function myparser(s){
if (!s) return new Date();
var ss = (s.split('-'));
var y = parseInt(ss[0],10);
var m = parseInt(ss[1],10);
var d = parseInt(ss[2],10);
if (!isNaN(y) && !isNaN(m) && !isNaN(d)){
return new Date(y,m-1,d);
} else {
return new Date();
}
}
上一篇: element-ui之多选框的使用
下一篇: UI 多选框,跳转。