首頁  >  文章  >  web前端  >  一個簡單的jquery的多選下拉框(自寫)_jquery

一個簡單的jquery的多選下拉框(自寫)_jquery

WBOY
WBOY原創
2016-05-16 16:50:001287瀏覽

今天做的項目要用到多選的下拉框,開始想在網上找一個插件用用,可是,網上的插件看起來都比較雜亂,我參考了網上的一些插件,自己用jquery寫了一個多選下拉框,js寫得比較簡潔。代碼如下。

js程式碼

複製程式碼 程式碼如下:


程式碼如下:


{
$.fn.extend({
checks_select: function(options){
jq_checks_select = null;
$(this).click(function(e){
jq_check this);
//jq_check.attr("class", "");
if (jq_checks_select == null) {
jq_checks_select = $("
").insertAfter(jq_check);
$.each(options, function(i, n){
check_div=$("
" n "
").appendTo(jq_checks_select);
check_box=check_div.children();
check_box.click(function(e){
//jq_check.attr("value ",$(this).attr("value") );

temp="";
$("input:checked").each(function(i){
if( i==0){
temp=$(this).attr("value");
}else{
temp ="、" $(this).attr("value");
}
});
jq_check.attr("value",temp);
e.stopPropagation();
});
});
}else{
jq_checks_select.toggle();

}
e.stopPropagation();
});
$(document).click(function () {
. hide();
});
//$(this).blur(function(){
//jq_checks_select.css("visibility","hidden");
//alert ();
//});
}
})

})(jQuery); 複製程式碼


程式碼如下:













需要jquery類別庫
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn