下拉选择框


在表单中,样式会被改变,具体查看表单介绍

代码
<select id="select">
	<option value="">请选择</option>
	<option value="1">电影</option>
	<option value="2">电视剧</option>
	<option value="3">动漫</option>
	<option value="4" disabled="disabled">音乐(禁用)</option>
	<option value="5">综艺</option>
	<option value="6">新闻</option>
	<option value="7">搞笑</option>
	<option value="8">萌宠</option>
</select>

<script>
	javaex.select({
		id : "select",
		isSearch : true,
		// 回调函数
		callback: function (rtn) {
			console.log("selectValue:" + rtn.selectValue);
			console.log("selectName:" + rtn.selectName);
		}
	});
</script>

参数说明(使用属性默认值时,可以缺省该属性)
序号 属性名 默认值 说明
1 id select选择框的id
2 maxNum 6 下拉列表最多显示多少项,超出会显示滚动条
3 isSearch fasle 是否允许检索。true:允许;fasle:不允许
4 isInit false 是否初始化就自动调用回调函数
5 callback 选择后的回调函数(默认初始化也会自动调用。返回一个对象,包含选中的值和对应的文本名称)

数据联动(亦可使用原生的onchange事件,但是填充数据后,依然需要重新调用组件)
代码
<select id="liandong1">
	<option value="">请选择</option>
	<option value="1">江苏</option>
	<option value="2">安徽</option>
</select>
<select id="liandong2">
	
</select>

<script>
	javaex.select({
		id : "liandong1",
		// 回调函数
		callback: function (rtn) {
			console.log("selectValue:" + rtn.selectValue);
			console.log("selectName:" + rtn.selectName);
			
			var html = '';
			if (rtn.selectValue=="1") {
				html += '<option value="WX">无锡</option>';
				html += '<option value="NJ">南京</option>';
			} else if (rtn.selectValue=="2") {
				html += '<option value="HF">合肥</option>';
				html += '<option value="HN">淮南</option>';
			}

			$("#liandong2").empty();
			$("#liandong2").append(html);
			
			javaex.select({
				id : "liandong2",
				// 回调函数
				callback: function (rtn) {
					console.log("selectValue:" + rtn.selectValue);
					console.log("selectName:" + rtn.selectName);
				}
			});
		}
	});
	
	javaex.select({
		id : "liandong2"
	});
</script>

改变大小(只需添加zoom属性即可)
代码
<select id="select2" zoom="1.2">
	<option value="">请选择</option>
	<option value="1">电影</option>
	<option value="2">电视剧</option>
	<option value="3">动漫</option>
	<option value="4">音乐</option>
	<option value="5">综艺</option>
	<option value="6">新闻</option>
	<option value="7">搞笑</option>
	<option value="8">萌宠</option>
</select>

<script>
	javaex.select({
		id : "select2"
	});
</script>