Question

JS 问题 ，在没有选择 第一个下拉框的时候 如何隐藏第二个下拉框？

<select name="b1" id="b1"></select><select disabled name="b2" id="b2"></select>
<script>
var data1 = {
"h1":"水晶石系列",
"h2":"彩色珠宝系列",
};
var data2 = {
"h1":['#|单色水晶',
'www.imonsa.com/changes.html|发晶',
'#|钛晶',
'#|水晶石',
],

"h2":['#|碧玺',
'#|坦桑石',
'#|托帕石',
],
};
function $(s){
return document.getElementById(s);
}

var tpl = '<option value="{val}">{str}</option>';

function init(){
var s="<option>请选择水晶系列</option>";
for(var i in data1){
s+=tpl.replace("{val}",i).replace("{str}",data1[i]);
}
$("b1").innerHTML = s;
}

function setTwo(s){
if(data2[s]){
var j = data2[s],l = j.length,s="<option>产品分类</option>",k;
for(var i = 0;i<l;i++){
k=j[i].split("|");
s+=tpl.replace("{val}",k[0]).replace("{str}",k[1]);
}
$("b2").disabled=false;
$("b2").innerHTML=s;
}
}
$("b1").onchange = function(){
if(!!this.value){
setTwo(this.value);
}
}
$("b2").onchange = function(){
if(!!this.value){
window.open("http://"+this.value);
}
}
init();
</script>

Answer 1

function init(){
    $('b2').style.display = 'none'; //加上这一句
    //...your code
}

function setTwo(s){
    $('b2').style.display = 'block'; //加上这一句
    //...your code 
}
简单修改，可能不太完善。

Answer 2

给你写了一点，自己看看是不是你要的效果，里面有注释