在select中,载入时默认select为空白,选项内不显示空白项

来源:互联网 发布:js中gripinnerhtml 编辑:程序博客网 时间:2024/05/29 15:08

今天做select的时候,页面要求为:载入默认选项框为空白,点击下拉框显示正常选项。 

找了半天  有两种办法,一种纯css实现,一种借助js实现。

先说js的办法吧。

html:

<body onload="load()">    <select id="abc" >                <option >1</option>            <option >2</option>                <option >3</option>                <option >4</option>         </select></body>

js:

<script>  function load()  {      var x = document.getElementById("abc");      x.selectedIndex = -1;  }  </script> 
实测成功。



纯css的方法:

<option selected="selected" disabled="disabled"  style='display: none' value=''></option>
上面的option置于第一行即可。



其实测了测,发现如果只保留:
 style='display: none'

效果也是一样的。




5 0