手機(jī)端網(wǎng)頁(yè)版app在使用下拉列表時(shí)，傳統(tǒng)的下拉列表使用起來(lái)體驗(yàn)非常不好，一般做的稍好一點(diǎn)的交互功能界面都不會(huì)直接使用下拉列表，所以app的原生下拉列表都是彈窗列表選擇，網(wǎng)頁(yè)型app從使用體驗(yàn)上來(lái)當(dāng)然也應(yīng)該做成那樣，前段時(shí)間在開(kāi)發(fā)網(wǎng)頁(yè)版app時(shí)就遇到這種需求，不僅是日期選擇器，數(shù)據(jù)列表、變量列表選擇等等下拉列表型需求都需要，網(wǎng)上找來(lái)找去只找到一款比較好的mobiscroll，不過(guò)下載比較麻煩，感覺(jué)比較奇怪的是jquery.mobile、jeasyui.mobile都沒(méi)有提供這種控件，不知道為什么？雖然我不是專做前端開(kāi)發(fā)，不過(guò)幾乎全能型的我覺(jué)的不難開(kāi)發(fā)吧，在家熬了一夜試了幾種方法終于找到一種幾乎完美的方法！在后來(lái)的使用中不斷完善，現(xiàn)在公開(kāi)提供給廣大程序員。先看看效果圖：
由于這控件的滾動(dòng)是使用div原生滾動(dòng)方法，觸摸屏使用時(shí)可以有慣性滾動(dòng)效果，也實(shí)現(xiàn)了鼠標(biāo)可以操作，不過(guò)沒(méi)有實(shí)現(xiàn)慣性滾動(dòng)效果。由于此控件主要是面向觸摸屏的，所以嘛觸摸屏完美就好了，我也懶的弄鼠標(biāo)版的特效了。此控件已封裝成jquery插件，沒(méi)有邊框，100%寬，使用很方便，比如套入彈窗后就是上圖效果。
代碼使用方法如下：
