var oBtnSub=document.getElementById('submit'); var oForm=document.getElementById('form'); oBtnSub.onclick=function(){ var aSel=oForm.getElementsByTagName('select'); for(var i=0;i<aSel.length;i++){ var sSel=aSel[i].options[aSel[i].selectedIndex].text; var oSpanS=aSel[i].nextElementSibling || aSel[i].nextSibling; if(sSel!='请选择'){ oSpanS.style.display='none'; } else{ oSpanS.style.display='inline-block'; } }; };
这是个对于多个下拉菜单的验证,在 ie9 以上及谷歌、火狐浏览器没问题,在 ie8 及以下版本就会报错。这是为什么呢?
block呢?
我只知道ie7-中本身为inline的元素转换成inline-block在不加浮动等属性时会失效。
我把 inline-block 改成 block,一样会报错……
看情况是IE8的元素不支持style,也就是oSpanS对象里没有style或者没有display对象
其实我发现问题出在 html 里,对于 input, select 这样的表单元素,如果想取到它们后面的兄弟元素,必须让它们紧贴着,有一个空格都不行。
<select class="span3" id="phase"> <option>请选择</option> <option>小学</option> <option>初中</option> <option>高中</option> <option>幼儿园</option> </select><span class="help-inline c-81f" style="display:none;">请选择学段</span>