這標(biāo)題,讓option支持事件監(jiān)聽(tīng),應(yīng)該不難的呀,有什么好講的?
其實(shí)還是有的,默認(rèn)在瀏覽器代碼是無(wú)法直接對(duì)option標(biāo)簽進(jìn)行操作的,不僅包括JS事件監(jiān)聽(tīng),還是CSS樣式設(shè)置
查了一些資料,姑且認(rèn)為它是系統(tǒng)OS級(jí)別處理的
想自定義option的樣式,很多人會(huì)建議用 <ul> <li> 標(biāo)簽來(lái)輔助同步操作與值
想對(duì)option進(jìn)行事件監(jiān)聽(tīng),有一個(gè)tip:當(dāng)給select顯示設(shè)置了size 屬性且值 大于1 時(shí),才能監(jiān)聽(tīng)
近來(lái)產(chǎn)品也提了個(gè)鼠標(biāo)操作復(fù)制option值的需求,就利用這個(gè)size屬性實(shí)現(xiàn)一番吧
先看圖
實(shí)現(xiàn)小析
因?yàn)閟elect的size屬性表示默認(rèn)展示多少個(gè)option,并設(shè)置這個(gè)高度
不過(guò)有了size之后,默認(rèn)select右側(cè)就會(huì)出現(xiàn)滾動(dòng)條式樣,加個(gè) overflow:hidden 處理就行了
延伸閱讀
- ssh框架 2016-09-30
- 阿里移動(dòng)安全 [無(wú)線安全]玩轉(zhuǎn)無(wú)線電——不安全的藍(lán)牙鎖 2017-07-26
- 消息隊(duì)列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】 2017-07-26
- 詞向量-LRWE模型-更好地識(shí)別反義詞同義詞 2017-07-26
- 從棧不平衡問(wèn)題 理解 calling convention 2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明 2017-07-26
- Swift實(shí)現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解 2017-07-26
- 阿里移動(dòng)安全 Android端惡意鎖屏勒索應(yīng)用分析 2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來(lái)看看(二) 2017-07-26