使用javascript为下拉列表赋值_Javascript_Html_Dom_Dom Manipulation

使用javascript为下拉列表赋值

javascript html dom

使用javascript为下拉列表赋值,javascript,html,dom,dom-manipulation,Javascript,Html,Dom,Dom Manipulation,我在wriiten javascriot中有两个级别的下拉列表，第一个是选择值，第二个是得到值。现在发生的事情是数组中的值被分配到第二个下拉列表中。我想将URL作为值分配给第二个下拉列表，并将其重定向到这些下拉列表。在我下面的示例中，如果我选择apparel，则我会在第二个下拉列表中获得男性和女性，因此如果我在第二个下拉列表中选择男性，则应转到xyz.com。。。。所以对于第二个下拉列表中的每个选项，我希望它被重定向到一个特定的url，我该如何做呢 <html> <head&g

我在wriiten javascriot中有两个级别的下拉列表，第一个是选择值，第二个是得到值。现在发生的事情是数组中的值被分配到第二个下拉列表中。我想将URL作为值分配给第二个下拉列表，并将其重定向到这些下拉列表。在我下面的示例中，如果我选择apparel，则我会在第二个下拉列表中获得男性和女性，因此如果我在第二个下拉列表中选择男性，则应转到xyz.com。。。。所以对于第二个下拉列表中的每个选项，我希望它被重定向到一个特定的url，我该如何做呢

<html>
<head>

<script type="text/javascript">

var categories = [];categories["startList"] = ["Apparel","Books"]
categories["Apparel"] = ["Men","Women"];
categories["Books"] = ["Biography","Fiction","Nonfiction"];


var nLists = 2; // number of lists in the set

function fillSelect(currCat,currList){
var step = Number(currList.name.replace(/\D/g,""));
for (i=step; i<nLists+1; i++) {
document.forms[0]['List'+i].length = 1;
document.forms[0]['List'+i].selectedIndex = 0;
}
var nCat = categories[currCat];
//var nurl= url[currCat]
for (each in nCat)  {
var nOption = document.createElement('option'); 
var nData = document.createTextNode(nCat[each]); 
nOption.setAttribute('value',nCat[each]); 
nOption.appendChild(nData); 
currList.appendChild(nOption); 
} 
}

function getValue(isValue) {
alert(isValue);
}

function init() {
fillSelect('startList',document.forms[0]['List1'])
}

navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false);    

</script>
</head>

<body>
<form action="">
<select name='List1' onchange="fillSelect(this.value,this.form['List2'])">
<option selected>Make a selection</option>
</select>
&nbsp;
<!--<select name='List2' onchange="fillSelect(this.value,this.form['List3'])">
<option selected>Make a selection</option>
</select>-->
&nbsp;
<select name='List2' onchange="getValue(this.value)">
<option selected >Make a selection</option>
</select>
</form>

</body>
</html>


var类别=[]；类别[“惊奇者”]=“服装”、“书籍”]
类别[“服装”]=“男性”、“女性”]；
类别[“书籍”]=“传记”、“小说”、“非小说”]；
变量nLists=2；//集合中的列表数
函数fillSelect（currCat，currList）{
var step=Number（currList.name.replace（/\D/g，“”）；
for（i=步骤；i
首先，您需要将源数组修改为JSON格式，如下所示：
var categories = [];categories["startList"] = [{"text":"Apparel","url":"Apparel"},{"text":"Books","url":"Books"}]
categories["Apparel"] = [{"text":"Men","url":"xyz.com"},{"text":"Women","url":"abc.com"}];
categories["Books"] = [{"text":"Biography","url":"Biography.com"},{"text":"Fiction","url":"Fiction.com"},{"text":"Nonfiction","url":"Nonfiction.com"}];

现在，在函数中，我们可以将其用作键值对：
var nLists = 2; // number of lists in the set

function fillSelect(currCat,currList){
var step = Number(currList.name.replace(/\D/g,""));
for (i=step; i<nLists+1; i++) {
document.forms[0]['List'+i].length = 1;
document.forms[0]['List'+i].selectedIndex = 0;
}
var nCat = categories[currCat];
//var nurl= url[currCat]
for (each in nCat)  {
var nOption = document.createElement('option'); 
var nData = document.createTextNode(nCat[each]["text"]); 
nOption.setAttribute('value',nCat[each]["url"]); 
nOption.appendChild(nData); 
currList.appendChild(nOption); 
} 
}

function getValue(isValue) {
//alert(isValue);
location.replace("http://" + isValue);
}

var nLists=2；//集合中的列表数
函数fillSelect（currCat，currList）{
var step=Number（currList.name.replace（/\D/g，“”）；
对于（i=step；i）您的意思是想用数组数据填充下拉列表吗？是的，用URL数组数据