最近項目中用到下拉列表,因爲瀏覽器對下拉列表的解析不同,且項目要求要用各自瀏覽器自帶的select效果。這個讓我完全放棄了使用別人寫的下拉列表控件(好比: bootstrap dropdown)。
下面是我select的一些總結。bootstrap
select 不存在站位文本,即不存在placeholder屬性。
沒有這個屬性,致使最大的問題就是select框顯示值必須是其option裏的一項,這也就是select沒法實現input的placeholder效果。如今網上的一些dropdown控件實現這個效果,他們都是把把select用Div,ui,li加上js模擬出來的。瀏覽器
select的option項油鹽不進。
有時候咱們但願當用戶點擊option時觸發一個js方法。很抱歉這個沒法實現,由於option的事件都被select自己控制了。還有就是在option裏面或者外面加元素都是很差用的,好比像下面這段代碼。當時的想法是在option裏面或外面套一個,而後獲取外面元素的事件,這樣就能夠模擬option被點擊的事件,可是惋惜沒有成功。在外面加元素會讓select沒法認識option,就會排除這一項。因此大部分監聽事件都是在select上監聽,好比用onChange。ui
<select> <span><option>good</option></span> <option><span>well<span></option> </select>
option裏添加樣式也是無效的,select自己已經給樣式了,不接收其餘的樣式。因此更改樣式只能在select標籤上更改。
附上 select的事件,屬性和方法
http://blog.csdn.net/huozhicheng/article/details/5416060spa