公司 部门 二级联动的JS

<td>公司名称：</td><td> <select style="width:100px;"id="corpName"  name="corpName">                   <option readonly="true" value="">--请选择--</option>                   <c:forEach var="corp" items="${corpBean}" >                   <option  value="${corp.corpName}" ><c:out value="${corp.corpName}"/></option>                 </c:forEach>            </select>                   </td><td> 部门名称:</td><td> <select style="width:100px;"id="deptName" name="deptName">        <option readonly="true" value="">--请选择--</option>        <c:forEach var="dept" items="${deptBean}" >        <option  value="${dept.deptName}" parentid="${dept.corpName}"  ><c:out value="${dept.deptName}"/></option>     </c:forEach> </select

<script type="text/javascript" language="javascript">$(function(){ $("#corpName").unbind("change", corpChange ).bind("change", corpChange); $("#deptName").unbind("change", deptChange).bind("change",deptChange);<span style="color:#FF0000"></span>$("#corpName").change();});function corpChange (){var selectedValue = $("#corpName").val();$("#deptName").children("span").each(function(){$(this).children().clone().replaceAll($(this)); }); if($.trim(selectedValue) != ""){ $("#deptName").children("option[parentid!='" + selectedValue + "'][value!='']").each(function(){$(this).wrap("<span style='display:none'></span>");});}}function deptChange(){$("#corpName").val($(this).children("option:selected").attr("parentid"));}</script>

主要是通过parentid来实现公司名称改变的时候，将不是选中公司的部门隐藏。

另外注意$("#corpName").change();在页面重新刷新时候，需要触发select的change事件。