使用第一个下拉列表创建多个下拉列表

时间:2015-11-17 17:03:06

标签: javascript list search onchange

我使用php编写此代码,并且我想为我的网页用户创建搜索的几个下拉列表。最后,使用所有选项从数据库中获取数据并将其打印出来。 我已经创建了第一个列表。

<form>
Parts: 
<select name="parts" id="parts" onchange="myFunction(this.value)">
    <option value="0" selected>Please Select</option>
    <option value="1">CPU</option>
    <option value="2">Graphic Card</option>
</select>
</form>

以下是其他下拉列表。                            

<form>
    <select id="price">
    </select>
</form>

<form>
    <select id="model">
    </select>
</form>

然后我想根据不同的用户选择创建其他下拉列表。 我在这里寻找其他一些问题并试了一下,但它没有用。它没有其他下拉列表的响应。看起来我无法获得函数中第一个列表的值。我不知道该怎么做。

<script type="text/javascript">
cpuBrand=new Array("AMD","Intel");      
cpuPrice=new Array("<500","500-999","1000-1999","2000-2999",">=3000");
cpuModel=new Array("Athlon,5350","A Series,A6-6400K","A Series,A4-7300");
gcBrand=new Array("ASUS","GALAXY");     
gcPrice=new Array("<500","500-999","1000-1999","2000-2999",">=3000");
gcModel=new Array(" FirePro W7100, 8GB GDDR5"," GT730, 2GB DDR3"," GTX750Ti OC, 1GB GDDR5");

$(document).ready(function () {
    $('#parts').change(function () {
        var part=$('#parts').val();
        $('#brand').html('');
        $('#price').html('');
        $('#model').html('');
        if(part=='1'){ 
            cpuBrand.forEach(function(t) { 
                $('#brand').append('<option>'+t+'</option>');
            });
            cpuPrice.forEach(function(t) { 
                $('#price').append('<option>'+t+'</option>');
            });
            cpuModel.forEach(function(t) { 
                $('#model').append('<option>'+t+'</option>');
            });
        }
        elseif(part=='2'){
            gcBrand.forEach(function(t) {
                $('#brand').append('<option>'+t+'</option>');
            });
            gcPrice.forEach(function(t) {
                $('#price').append('<option>'+t+'</option>');
            });
            gcModel.forEach(function(t) {
                $('#model').append('<option>'+t+'</option>');
            });
        }
    }
}
</script>

我必须为每个第一个列表选项创建三到四个列表。 有人可以帮我创建上面的第一个吗?

非常感谢!

0 个答案:

没有答案