jsp页面中 用javaScript做成的二级联动的代码
4个回答
2011-01-19
展开全部
这里有一个多级联动下拉select菜单
还可以自己设置默认显示值
里面有代码可以参考
还可以自己设置默认显示值
里面有代码可以参考
参考资料: http://www.blueidea.com/common/shoutbox/redir.asp?5=u&id=11685
展开全部
<select name="pro_itemcode1" id="sel1" class="tbRMain" style="width:130px">
</select>
<select name="pro_itemcode2" id="sel2" class="tbRMain" style="width:130px">
</select>
<select name="pro_itemcode3" id="sel3" class="tbRMain" style="width:130px">
</select>
<select name="pro_itemcode4" id="sel4" class="tbRMain" style="width:130px">
</select>
。。。。。。。。。。。。。。。。
<script type="text/javascript">
var arrSelect = new Array(document.getElementById("sel1"), document.getElementById("sel2"), document.getElementById("sel3"), document.getElementById("sel4"));
//定义联动数据数组。
var arrData = new Array();
<%
ResultSet rssmsclass=dbquery.execQuerySQL("select * from pro_item");
int i = 0;
while(rssmsclass.next())
{
%>arrData[<%=i%>]= [<%=formatstr.getNoNull(rssmsclass.getString("itemcode"),"")%>,<%=formatstr.getNoNull(rssmsclass.getString("itemscode"),"")%>,'<%=formatstr.getNoNull(rssmsclass.getString("itemname"),"")%>','<%=formatstr.getNoNull(rssmsclass.getString("itemcode"),"")%>'];
<% i++;
}
%>
//默认值数组
var arrDefault = new Array('' ,'' ,'','');
function arrInit(strInitID, arrSelect, arrMatrix, arrDefValue) {
function doChange(iIndex) {
var iCount = 0;
var sParentID = strInitID;
if (iIndex > 0) sParentID = arrSelect[iIndex - 1].options[arrSelect[iIndex - 1].selectedIndex].ID;
with (arrSelect[iIndex]) {
length = 0;
options[iCount++] = new Option('——————————', '', false, true);
for (var i = 0; i < arrMatrix.length; i++) {
if (String(arrMatrix[i][1]) == String(sParentID)) {
var oNewOption = new Option(arrMatrix[i][2], arrMatrix[i][3], false, false);
oNewOption.ID = arrMatrix[i][0];
options[iCount++] = oNewOption;
if(arrMatrix[i][3] == arrDefValue[iIndex]) options[iCount - 1].selected = true;
};
};
//联动改变所有子select
if (++iIndex < arrSelect.length) doChange(iIndex);
};
};
if (!arrDefValue) arrDefValue = [];
for (var i = 0; i < arrSelect.length - 1; i++) {
eval("arrSelect[" + i + "].onchange = function(){doChange(" + (i + 1) + ");};");
}
doChange(0);
//只有第一次调用初始化主函数arrInit才使用默认值,之后手动选择不受默认值限制,因此清空。
arrDefValue = [];
};
arrInit(0,arrSelect,arrData,arrDefault);
</script>
</select>
<select name="pro_itemcode2" id="sel2" class="tbRMain" style="width:130px">
</select>
<select name="pro_itemcode3" id="sel3" class="tbRMain" style="width:130px">
</select>
<select name="pro_itemcode4" id="sel4" class="tbRMain" style="width:130px">
</select>
。。。。。。。。。。。。。。。。
<script type="text/javascript">
var arrSelect = new Array(document.getElementById("sel1"), document.getElementById("sel2"), document.getElementById("sel3"), document.getElementById("sel4"));
//定义联动数据数组。
var arrData = new Array();
<%
ResultSet rssmsclass=dbquery.execQuerySQL("select * from pro_item");
int i = 0;
while(rssmsclass.next())
{
%>arrData[<%=i%>]= [<%=formatstr.getNoNull(rssmsclass.getString("itemcode"),"")%>,<%=formatstr.getNoNull(rssmsclass.getString("itemscode"),"")%>,'<%=formatstr.getNoNull(rssmsclass.getString("itemname"),"")%>','<%=formatstr.getNoNull(rssmsclass.getString("itemcode"),"")%>'];
<% i++;
}
%>
//默认值数组
var arrDefault = new Array('' ,'' ,'','');
function arrInit(strInitID, arrSelect, arrMatrix, arrDefValue) {
function doChange(iIndex) {
var iCount = 0;
var sParentID = strInitID;
if (iIndex > 0) sParentID = arrSelect[iIndex - 1].options[arrSelect[iIndex - 1].selectedIndex].ID;
with (arrSelect[iIndex]) {
length = 0;
options[iCount++] = new Option('——————————', '', false, true);
for (var i = 0; i < arrMatrix.length; i++) {
if (String(arrMatrix[i][1]) == String(sParentID)) {
var oNewOption = new Option(arrMatrix[i][2], arrMatrix[i][3], false, false);
oNewOption.ID = arrMatrix[i][0];
options[iCount++] = oNewOption;
if(arrMatrix[i][3] == arrDefValue[iIndex]) options[iCount - 1].selected = true;
};
};
//联动改变所有子select
if (++iIndex < arrSelect.length) doChange(iIndex);
};
};
if (!arrDefValue) arrDefValue = [];
for (var i = 0; i < arrSelect.length - 1; i++) {
eval("arrSelect[" + i + "].onchange = function(){doChange(" + (i + 1) + ");};");
}
doChange(0);
//只有第一次调用初始化主函数arrInit才使用默认值,之后手动选择不受默认值限制,因此清空。
arrDefValue = [];
};
arrInit(0,arrSelect,arrData,arrDefault);
</script>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
很简单,搜索一下js联动菜单
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
JSP是服务器端运行的,javaScript是客户端浏览器运行的。在JSP中自然是不能运行的javaScript的。你的意思应该是用JSP动态的生成了javaScript,然后在浏览器上运行时出现“对象不支持此操作”吧?此问题绝大部分原因是javaScript的语法错误或javaScript的对象调用错误造成的。由于是动态生成的,调试起来有点难度。你可以在console中把生成的javaScript打印出来,再仔细的查看错误的原因。或者使用alert进行调试。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询