Question

我想创建一个依赖于s1.value值的第二个数组。如果可能的话？我可以让两个数组依赖一个变量。我以为我可以复制两次这个功能，但这似乎不起作用。有谁可以帮助我？

<html>
    <head>
    <script>
    function populate(s1,s2){
    	var s1 = document.getElementById(s1);
    	var s2 = document.getElementById(s2);
    	s2.innerHTML = "";
    	if(s1.value == "Chevy"){
    		var optionArray = ["|","camaro|Camaro","corvette|Corvette","impala|Impala"];
    	} else if(s1.value == "Dodge"){
    		var optionArray = ["|","avenger|Avenger","challenger|Challenger","charger|Charger"];
    	} else if(s1.value == "Ford"){
    		var optionArray = ["|","mustang|Mustang","shelby|Shelby"];
    	}
    	for(var option in optionArray){
    		var pair = optionArray[option].split("|");
    		var newOption = document.createElement("option");
    		newOption.value = pair[0];
    		newOption.innerHTML = pair[1];
    		s2.options.add(newOption);
    	}
    }
    function populate(s0){
        var s0 = document.getElementById(s0);
        s0.innerHTML="";
        if(s1.value == "Chevy"){
            var optionArray = ["|","johnny|Johnny" , "janey|Janey", "jimmy|Jimmy" , "kiesha|Kiesha"];
        }
        for(var option in optionArray){
            var par = optionArray[option].split("|");
            var newOption = document.createElement("option");
            newOption.value = pair[0];
            newoption.innerHTML = pair[1];
            s0.options.add(newOption);
        }
    }
      
    </script>
    </head>
    <body>
    <h2>Choose Your Car</h2>
    <hr />
    Choose Car Make:
    <select id="slct1" name="slct1" onchange="populate(this.id,'slct2','slct0')">
      <option value=""></option>
      <option value="Chevy">Chevy</option>
      <option value="Dodge">Dodge</option>
      <option value="Ford">Ford</option>
    </select>
    <hr />
    Choose Car Model:
    <select id="slct2" name="slct2"></select>
    <hr />
    Choose who gets the car
    <select id="slct0" name="slct0"></select>
    </body>
    </html>

Answer 1

实际上你不需要功能填充（s0），试试这个：）

注意：你必须确保变量拼写是正确的，因为当我运行你的代码时，我发现很多变量拼写错误。

<!DOCTYPE html>
    <html>
    <head>
    
    <script>
    function populate(s1,s2,s0){
        var s1 = document.getElementById(s1);
        var s2 = document.getElementById(s2);
        s2.innerHTML = "";
        if(s1.value == "Chevy"){
            var optionArray = ["|","camaro|Camaro","corvette|Corvette","impala|Impala"];
        } else if(s1.value == "Dodge"){
            var optionArray = ["|","avenger|Avenger","challenger|Challenger","charger|Charger"];
        } else if(s1.value == "Ford"){
            var optionArray = ["|","mustang|Mustang","shelby|Shelby"];
        }
        for(var option in optionArray){
            var pair = optionArray[option].split("|");
            var newOption = document.createElement("option");
            newOption.value = pair[0];
            newOption.innerHTML = pair[1];
            s2.options.add(newOption);
        }
    
    
         var s0 = document.getElementById(s0);
        s0.innerHTML="";
        if(s1.value == "Chevy"){
            var optionArray = ["|","johnny|Johnny" , "janey|Janey", "jimmy|Jimmy" , "kiesha|Kiesha"];
        }else{
        	var optionArray = ["|", "someValue|Some value"];
        }
        for(var option in optionArray){
            var pair = optionArray[option].split("|");
            var newOption = document.createElement("option");
            newOption.value = pair[0];
            newOption.innerHTML = pair[1];
            s0.options.add(newOption);
        }
    }
    
    /*
    Function populate(s0){
        var s0 = document.getElementById(s0);
        s0.innerHTML="";
        if(s1.value == "Chevy"){
            var optionArray = ["|","johnny|Johnny" , "janey|Janey", "jimmy|Jimmy" , "kiesha|Kiesha"];
        }
        for(var option in optionArray){
            var par = optionArray[option].split("|");
            var newOption = document.createElement("option");
            newOption.value = pair[0];
            newoption.innerHTML = pair[1];
            s0.options.add(newOption);
        }
    }
    */
    </script>
    </head>
    <body>
    <h2>Choose Your Car</h2>
    <hr />
    Choose Car Make:
    <select id="slct1" name="slct1" onchange="populate(this.id,'slct2','slct0')">
      <option value=""></option>
      <option value="Chevy">Chevy</option>
      <option value="Dodge">Dodge</option>
      <option value="Ford">Ford</option>
    </select>
    <hr />
    Choose Car Model:
    <select id="slct2" name="slct2"></select>
    <hr />
    Choose who gets the car
    <select id="slct0" name="slct0"></select>
    </body>
    </html>

两个数组使用相同的变量。第二和第三下拉依赖于第一阵列完全不同

1 个答案: