<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>My JSP 'mylist_liti.jsp' starting page</title> <script language="javascript"> var cateArray = new Array(); cateArray[cateArray.length]=new Array("1","新能源"); cateArray[cateArray.length]=new Array("2","自然吸气发动机"); var titleArray = new Array(); titleArray[titleArray.length]=new Array("1","1","续航里程"); titleArray[titleArray.length]=new Array("2","2","排量"); function setTitle(obj1ID,obj2ID){ var objCate = document.getElementById(obj1ID); var objTitle = document.getElementById(obj2ID); var i; var itemArray = null; if(objCate.value.length > 0){ itemArray = new Array(); for(i=0;i<titleArray.length;i++){ if(titleArray[i][0]==objCate.value){ itemArray[itemArray.length]=new Array(titleArray[i][1],titleArray[i][2]); } } } for(i = objTitle.options.length ; i >= 0 ; i--){ objTitle.options[i] = null; } objTitle.options[0] = new Option("请选择职称"); objTitle.options[0].value = ""; if(itemArray != null){ for(i = 0 ; i < itemArray.length; i++){ objTitle.options[i+1] = new Option(itemArray[i][1]); if(itemArray[i][0] != null){ objTitle.options[i].value = itemArray[i][0]; } } } } </script> </head> <body style="background: url(${ctx }/images/iframe_bg.gif) repeat-x; margin: 2px;"> <div id="create" style="border: 1px solid #84a1bd; margin: 10px 250px; "> <form name="createForm" action="${ctx}/sys/tea.do?method=createTea" method="post"> <table width="60%" align="center" cellpadding="0" cellspacing="0" style="font-size: 13px;"> <tr> <td align="center" width="28%" height="30"> 职称类型 </td> <td align="left"> <select name="cateid" id="cateid" onChange="setTitle('cateid','titleid')"> <option value="">请选职称类型</option> <option value="1" > 新能源 </option> <option value="2"> 自然吸气发动机 </option> </select> </td> </tr> <tr> <td align="center" width="28%" height="30"> 职 称 </td> <td align="left"> <select name="title" id="titleid"> <option value="暂无"> 请选职称 </option> </select> </td> </tr> </table> </form> </div> <br /> </body> </html>
在select联动中使用了调用了onChange的方法，其中设置了array进行级联显示
显示效果
2017-04-19