類比select的代碼

幾年前不知道在哪下載的源碼上改的，去年開始學jquery，就改了一下，代碼有點亂。
只是自己用，沒有考慮寫成通用的組件，所以童鞋們如果真的要拿去用的話有點麻煩

幾個狀態，展開收合是jquery的slide

這個類比select，只是很簡單的實現了單獨一個select的部分功能
沒有實現比如optgroup，文字長度自適應（圖片會因此修改麻煩）
再說如果頁面多個select，css處理也麻煩，
資料、聯動都要增加大量代碼

小有小的好處，所以就不考慮進行封裝，
這裡有不少童鞋做的比我好很多，功能很強大

再所以，就偷一下懶，在這裡送上js注釋給初學者
複製代碼 代碼如下:
$(document).ready(function(){
var newSelect = $("#aa");
newSelect.click(function(e){
//如果沒有class，即關閉狀態，就展開
//開啟狀態就不需要處理，冒泡執行document.click
if(this.className == ""){
this.className = "open";
$(this.nextSibling).slideDown("fast");
e.stopPropagation();//阻止冒泡
}
});

//關閉收合
function closeSelect(obj){
$(obj.nextSibling).slideUp("fast",function(){
obj.className = "";
});
}
$(document).bind("click", function() {
closeSelect(newSelect[0]);
});
newSelect.next().click(function(e){
var src = e.target;

//如果有選中任何一項，取選中文字執行替換操作並改變樣式，相當於select.onchange
//冒泡執行document.click關閉收合
if(src.tagName == "A"){
var PObj = src.parentNode;
PObj.previousSibling.innerHTML = src.innerHTML;
$(src).siblings().removeClass();
src.className = "current";
PObj.nextSibling.value = src.getAttribute("value");
}
});
});

示範地址：http://demo.jb51.net/js/2011/jquery_select/
打包下載：http://www.jb51.net/jiaoben/39490.html