jquey显示隐藏input对象

最新推荐文章于 2021-06-05 08:54:38 发布

原创最新推荐文章于 2021-06-05 08:54:38 发布 · 1k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#jquery

收录于

javascript 专栏收录该内容

16 篇文章

订阅专栏

本文介绍了一种使用HTML和JavaScript实现的动态部门选择功能。当用户从下拉列表中选择‘其他’部门选项时，会显示一个额外的文本输入框供用户手动输入部门名称。通过这种方式，系统可以灵活地收集不在预定义列表中的部门信息。

1 所属部门选择其他时显示一个输入框进行填写

<select id='deptid' name='deptid' class="select" onchange='deptChange()'>
	<c:forEach var="item" items="${deptidList}" varStatus="status">
		<option value='${item.value}'> ${item.name} </option>
	</c:forEach>
</select> 
<!-- 类型为其他时 需要填写其它部门 -->
<input id='otherDept' name='otherDept' type="text" class="text" maxlength='50' style='display:none;'/>

// 根据切换是否显示其他部门输入框
	function deptChange(){
		var deptid = $('#deptid').val();
		// alert('type:'+hytpye);
		if(deptid=='other'){
			$('#otherDept').show();
		}else{
			$('#otherDept').hide();
		}
	}