在select中，載入時預設select為空白，選項內不顯示空白項

Casanover發表於2017-03-08

今天做select的時候，頁面要求為：載入預設選項框為空白，點選下拉框顯示正常選項。 

找了半天  有兩種辦法，一種純css實現，一種藉助js實現。

先說js的辦法吧。

html：

<body οnlοad="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置於第一行即可。





相關文章