下拉列表多选

(function () {
$.fn.extend({
checks_select: function (options, className, selectId, values, IsSelectAll) {//IsSelectAll是否全选
debugger;
jq_checks_select = null;
selectId.next().empty(); //先清空
selectId.unbind("click");
checkTrue = false;
selectId.click(function (e) {
$("#Multselectdiv").remove();
jq_checks_select = null;
var jq_check = selectId;
var jq_checkName = selectId;
if (values) {
jq_checkName = values;
}
if (jq_checks_select == null) {
jq_checks_select = jq_check.next();
if (className != null && className != "") {
jq_checks_select.addClass(className);
jq_checks_select = $("<div class='" + className + "' id=\"Multselectdiv\"></div>").insertAfter(jq_check);
} else {
jq_checks_select = $("<div id=\"Multselectdiv\" style='width: 150px;background-color:White; border: 1px solid #18cbcd;font-size: 12px; position: absolute;left: 2px;top: 25px;cursor:pointer;height:120px;overflow:hidden;overflow-y:scroll;'></div>").insertAfter(jq_check);
}
var selectval = selectId.val();
$.each(eval(options), function (i, n) {
if (i == 0) {
if (!IsSelectAll) {
check_div1 = $("<div><input type='checkbox' id='Multselect_' name='Multselect1'><label for='Multselect_'>全选</label></div>").appendTo(jq_checks_select);
}
if (selectId.val().length > 0 && selectval.indexOf(n.name) >= 0) {
check_div = $("<div><input type='checkbox' id='Multselect_" + i + "_" + selectId.attr("id") + "' value='" + n.id + "' name='Multselect_" + selectId.attr("id") + "' checked='checked'><label for='Multselect_" + i + "_" + selectId.attr("id") + "'>" + n.name + "</label></div>").appendTo(jq_checks_select);
} else {
check_div = $("<div><input type='checkbox' id='Multselect_" + i + "_" + selectId.attr("id") + "' value='" + n.id + "' name='Multselect_" + selectId.attr("id") + "'><label for='Multselect_" + i + "_" + selectId.attr("id") + "'>" + n.name + "</label></div>").appendTo(jq_checks_select);
}
} else {
if (selectId.val().length > 0 && selectval.indexOf(n.name) >= 0) {
check_div = $("<div><input type='checkbox' id='Multselect_" + i + "_" + selectId.attr("id") + "' value='" + n.id + "' name='Multselect_" + selectId.attr("id") + "' checked='checked'><label for='Multselect_" + i + "_" + selectId.attr("id") + "'>" + n.name + "</label></div>").appendTo(jq_checks_select);
} else {
check_div = $("<div><input type='checkbox' id='Multselect_" + i + "_" + selectId.attr("id") + "' value='" + n.id + "' name='Multselect_" + selectId.attr("id") + "'><label for='Multselect_" + i + "_" + selectId.attr("id") + "'>" + n.name + "</label></div>").appendTo(jq_checks_select);
}
}
check_box = check_div.children();
if (!IsSelectAll) {
check_box1 = check_div1.children();
}
check_box.click(function (e) {
selectId.parents().find("input[name='Multselect_" + selectId.attr("id") + "']:checked").each(function (i) {
if (i == 0) {
jq_checkName.val($(this).val());
jq_check.val($(this).next().html());
} else {
jq_checkName.val(jq_checkName.val() + ',' + $(this).val());
jq_check.val(jq_check.val() + "," + $(this).next().html());
}
});
e.stopPropagation();
});
if (!IsSelectAll) {
check_box1.click(function (e) {
if (selectId.parents().find("input[name='Multselect1']").attr("checked") == true) {
selectId.parents().find("input[name='Multselect_" + selectId.attr("id") + "']").each(function (i) {
if (i == 0) {
jq_checkName.val($(this).val());
jq_check.val($(this).next().html());
} else {
jq_checkName.val(jq_checkName.val() + ',' + $(this).val());
jq_check.val(jq_check.val() + "," + $(this).next().html());
}
});
selectId.parents().find("input[name='Multselect_" + selectId.attr("id") + "']").attr("checked", "true");
}
else if (selectId.parents().find("input[name='Multselect1']").attr("checked") == false) {
jq_check.val("");
jq_checkName.val("");
selectId.parents().find("input[name='Multselect_" + selectId.attr("id") + "']").attr("checked", "");
}
e.stopPropagation();
jq_checks_select.show();
});
}
});
jq_checks_select.show();
} else {
jq_checks_select.toggle();
}
e.stopPropagation();
});
$(document).click(function () {
flag = selectId;
if (flag.val() == "") {
flag.val("");
}
if (jq_checks_select != null) {
jq_checks_select.hide();
$("#Multselectdiv").hide();
}
});
}
});
})(jQuery);