Jquery映射下拉框和单选框

不再Struts2的框架下下拉框和单选框的映射是非常复杂和麻烦的,这里一个组件,由Vososo站长开发调试,现在免费发布给大家使用,欢迎反馈。
render.js 代码如下:

/*映射 ERadio 脚本
用法:
1、在页面reload的时候配置
jQuery(function(){
	renderERadio();
});
2、在页面中配置
<span>{"val":"男","name":"student","vals":["女","男"]}</span>
<span>{"val":"-1","name":"teacher","vals":["1","0","-1"],"radioTxts":["有","无","其他"]}</span>
即可在<span></span>内部生成
<input type="radio" .... /> radioTxt

配置参数:
val : radio 的值
name : radio 的 name 属性
vals : radio 数组值
radioTxts : 可选参数 ,默认等于 vals
*/
function renderERadio(){
	jQuery.each(jQuery(".eRadio"),function(){
		vv =  jQuery.parseJSON(jQuery(this).html());
		if(vv.radioTxts==undefined){
			vv.radioTxts=vv.vals;
		}else if(vv.vals==undefined){
			vv.vals=vv.radioTxts;
		}
		var html = "";
		jQuery.each(vv.vals,function(i,n){
			if(vv.val==vv.vals[i]){
				html += '<input type="radio" name="'+vv.name+'" value="'+vv.vals[i]+'" checked="true" />'+vv.radioTxts[i];
			}else{
				html += '<input type="radio" name="'+vv.name+'" value="'+vv.vals[i]+'" />'+vv.radioTxts[i];
			}
		});
		jQuery(this).html(html);
	});
}
/*映射 eSelect 脚本
用法通 eRadio:
1、在页面reload的时候配置
jQuery(function(){
	renderESelect();
});
2、在页面中配置
<span>{"val":"男","name":"student","vals":["女","男"]}</span>
或者
<span>{"val":"-1","name":"teacher","vals":["1","0","-1"],"optionVals":["有","无","其他"]}</span>

即可在<span></span>内部生成
<select name="xxx">..optionVal..</select>

配置参数:
val : select 的值
name : select 的 name 属性
vals : select 的数组值
optionVals : 可选参数 ,默认等于 vals
*/
function renderESelect(){
	jQuery.each(jQuery(".eSelect"),function(){
		vv =  jQuery.parseJSON(jQuery(this).html());
		if(vv.optionVals==undefined){
			vv.optionVals=vv.vals;
		}else if(vv.vals==undefined){
			vv.vals=vv.optionVals;
		}
		var html = '<select name="'+vv.name+'">';
		jQuery.each(vv.vals,function(i,n){
			if(vv.val==vv.vals[i]){
				html += '<option value="'+vv.vals[i]+'" selected="true">'+vv.optionVals[i]+'</option>';
			}else{
				html += '<option value="'+vv.vals[i]+'">'+vv.optionVals[i]+'</option>';
			}
		});
		html += '</select>';
		jQuery(this).html(html);
	});
}

演示demo下载地址

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值