【汇智论坛】layui动态生成下拉框，复选框，单选框，并默认选中（适用场景：查看或编辑回显）

原贴地址：http://www.jingyingjidi.com/talk/html/jie/detail.html?id=b212e1aa6c444bf5b40009412b51568b

 

可以改写成ajax动态获取，这里是写死了几个选项，做个示例，怎么样动态生成下拉框，复选框，单选框，并默认选中

在编辑，查看页面我们经常需要这么做。

1.html

代码如下：

	

		
          *用户名
      
		

			
		
	

	

		
          *支付方式
      
		

			

			
		
	
	

		*发票抬头
		

			
		
		

			*
		
	
	

		复选框
		


		
	
	

		开关
		

			
		
	
	

		单选框
		


		
	

2.js代码如下

layui.use(['form', 'admin', 'jquery', 'table', 'layer'], function() {
	var form = layui.form,
		admin = layui.admin,
		$ = layui.jquery,
		table = layui.table,
		layer = layui.layer;
		
	
	//动态生成下拉框并回显选中
		
	$('#contrller').append(new Option("支付方式", "1"));
	$('#contrller').append(new Option("支付宝", "2"));
	$('#contrller').append(new Option("微信", "3"));
	$('#contrller').append(new Option("货到付款", "4"));
	$('#contrller').append(new Option("赊账", "5"));
	
	layui.form.render("select");
	
	//复选框动态添加
	$('#likeCheckBox').append('');
	$('#likeCheckBox').append('');
	$('#likeCheckBox').append('');
	$('#likeCheckBox').append('');
	
	
	//动态添加单选框
	$('#sexRadio').append('');
	$('#sexRadio').append('');
	$('#sexRadio').append('');
	
	//初始化表单赋值
	//查看或编辑回显
	form.val("test1aa",{
		"username":"沾上干",
		"contrller":"5",
		"like[qu]":true,
		"sex":"2"
	});
});