唐山網(wǎng)站建設(shè),唐山網(wǎng)站制作,唐山做網(wǎng)站,唐山網(wǎng)頁設(shè)計,唐山網(wǎng)站優(yōu)化,唐山網(wǎng)絡(luò)公司,唐山400電話業(yè)務(wù) 24小時熱線：15031560143 關(guān)于我們 | 網(wǎng)站模版 | 支付方式 | 網(wǎng)站地圖
很多人為select的諸多不完善而頭痛，如無法自定義樣式、IE6中無法被浮動層遮住等等。下面介紹一款堪稱最完美的下拉框組件：UU人下拉框
特點1：美化的并且可自定義的外觀
UU人下拉框使用JS進行渲染。當頁面引入了腳本和CSS后，頁面中的下拉框都會變成如下外觀：
該外觀是由CSS和圖片控制。通過修改CSS可以很方便地實現(xiàn)更改外觀。
UU人下拉框不存在IE6中無法被浮動層遮住等問題。
特點2：使用簡單
UU人下拉框代碼寫法與原來的寫法一樣，都是如下代碼：
<select>
<option value="">請選擇功能</option>
<option value="1">新增圖片</option>
<option value="2">維護圖片</option>
<option value="3">新增新聞</option>
</select>
也可以動態(tài)創(chuàng)建UU人下拉框。
特點3：寬度處理
你是否遇到以下兩種情況：
（1）不設(shè)置下拉框?qū)挾�，那么下拉框�(qū)挾饶J為最寬的選項的寬度。當其選項過長時輕則會導(dǎo)致整個表單不整齊，重則會撐壞頁面布局；
（2）設(shè)置下拉框?qū)挾�，但是由于下拉框的選項寬度有可能會很長，可能會導(dǎo)致內(nèi)容顯示不完全。
UU人下拉框?qū)τ趯挾鹊奶幚矸绞绞牵耗J會有一個寬度，即使選項里面有很長的文字。效果如下：
這樣就保證了表單元素寬度一致又不影響內(nèi)容。放在表單中的整體效果如下：
如果希望下拉框的寬度自適應(yīng)最長選項，為其設(shè)置一個參數(shù)即可，效果如下：
另外還可以通過style強制一個寬度。
特點4：支持分組
下拉框支持分組，代碼與普通select分組代碼一樣。如
<select>
<option>請選擇權(quán)限</option>
<optgroup label="首頁信息發(fā)布">
<option value="新增圖片">新增圖片</option>
<option value="維護圖片">維護圖片</option>
<option value="新增新聞">新增新聞</option>
</optgroup>
<optgroup label="人員維護">
<option value="新增用戶">新增用戶</option>
<option value="用戶列表">用戶列表</option>
</optgroup>
</select>
效果如下：
特點5：下拉列表展開的方向智能化
原始的下拉框如果在網(wǎng)頁中的位置比較偏下，向下展開肯能會導(dǎo)致內(nèi)容顯示不全。
UU人下拉框在這種情況會進行智能判斷從而向上展開。效果如下：
當下拉列表選項過多，向上也無法展示完全時，UU人下拉框會判斷一下向上和向下哪里空間大，就向哪里展開，并出現(xiàn)滾動條。效果如下：
特點6：下拉框可編輯
為下拉框代碼添加一個屬性，就把它變成了一個可編輯的下拉框，效果如下：
特點7：集成了ajax聯(lián)動功能
通過設(shè)置可以很簡單地實現(xiàn)下拉框聯(lián)動功能�？芍С值穆�(lián)動級數(shù)為無限級！
例如如下代碼就創(chuàng)建了一個二級聯(lián)動的下拉框：
所學(xué)專業(yè)：
<select id="sel01" childId="sel02" childDataPath=" http://localhost/kj/trainplan.do?method=" >
<option value="">請選擇專業(yè)</option>
<option value="bj1">專業(yè)1</option>
<option value="bj2">專業(yè)2</option>
</select>
所屬班級：
<select id="sel02">
<option value="0">請先選擇專業(yè)</option>
</select>
代碼中的childId指定要聯(lián)動的下拉框的ID，childDataPath指定二級下拉框數(shù)據(jù)來源，與一級下拉框的value關(guān)聯(lián)來獲取數(shù)據(jù)。
效果如下：
特點8：自定義下拉列表的列數(shù)
當下拉框項目過多時，可以通過添加一個屬性來指定列數(shù)，并可自定義列寬。效果如下：
特點9：完美的瀏覽器兼容性
無論是IE6、IE7、IE8還是FireFox、Chrome、Safira，甚至在Linux下都保持功能與外觀的一致性。
在http://9899v.com應(yīng)用測試通過