单选和多选集成的jquery combobox插件

<title>单选和多选集成的jquery combobox插件</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<style>
.pop{position:absolute;border:solid 1px black;display:none;padding:5px;background:#eeeeee}
.pop a.x{position:absolute;border:solid 1px red;color:Red;top:2px;right:2px;font-size:12px;cursor:pointer}
</style>
<script>
    window.onload = function () {
        //data：格式如[{text:"显示的文本",value:"值"},{text:"显示的文本",value:"值",mul:true}....]//归类为多选则增加mul配置，如果显示的文本和值一样，可以省略value配置
        //selectAll：默认为false，不允许单选多选一起选，选择单选后多选不可用，否则返过来，设置为true则都可以选择，没有限制
        $.fn.singleMulSelect = function (data, selectAll) {
            if (this.length == 0 || !data || data.length == 0) return false;
            var items = [], s = '', hasKV = false;
            for (var i = 0; i < data.length; i++) {
                if (data[i].value != undefined) hasKV = true;
                items[i] = '<input value="' + (data[i].value != undefined ? data[i].value : data[i].text) + '" type="' + (data[i].mul ? 'checkbox' : 'radio') + '" {name}/>' + data[i].text;
            }
            s = items.join('<br/>');
            return $(this).each(function (i, el) {
                var popLayer, pos = $(this).offset(), me = this;
                function initPopLayer(value) {
                    popLayer = $('<div class="pop"></div>').appendTo(document.body);
                    var guid = new Date().getTime(), btnOK = $('<input type="button" value="确定"/>'), btnReset = $('<input type="button" value="清空"/>');
                    popLayer.append(s.replace(/\{name\}/g, 'name="n' + guid + '"') + '<div></div><a class="x" onclick="$(this).parent().hide()">关闭</a>')
                    .css({ left: pos.left, top: pos.top + this.offsetHeight }).find('div').append(btnReset).append('　').append(btnOK);
                    if (value) {
                        var arr = value.split(',');
                        for (var i = 0; i < arr.length; i++) popLayer.find('input[value="' + arr[i] + '"]').attr('checked', true);
                    }
                    if (!selectAll) {
                        if (value) popLayer.find(popLayer.find(':checked:first').attr('type') == 'radio' ? ':checkbox' : ':radio').attr('disabled', true);
                        popLayer.find('>input').click(function () {
                            if (this.type == 'radio') popLayer.find(':checkbox').attr('disabled', true);
                            else {
                                popLayer.find(':radio').attr('disabled', popLayer.find(':checkbox:checked').size() > 0 ? true : false);
                            }
                        });
                    }
                    btnReset.click(function () { popLayer.find('>input').attr({ checked: false, disabled: false }); });
                    btnOK.click(function () {
                        $(this).parent().parent().hide();
                        var values = '', texts = '';
                        popLayer.find('>input:checked').each(function () {
                            values += ',' + this.value;
                            texts += ',' + this.nextSibling.data;
                        });
                        if (values != '') {
                            values = values.substring(1);
                            texts = texts.substring(1);
                        }
                        me.value = texts;
                        if (hasKV) me.setAttribute('hvalue', values);
                    });
                }
                initPopLayer(this.getAttribute('hvalue') || this.value);
                $(this).focus(function () { popLayer.show(); });
            });
        }
        $('input').singleMulSelect([{ text: "C#", mul: true }, { text: "JavaScript", mul: true }, { text: "Java", mul: true }, { text: "男", value: 1 }, { text: "女", value: 0}]);
    }
</script>
<!--注意如果你的类型有键值对格式的，就是存的是id，显示的是名称，那么要给text增加自定义hvalue属性，否则不需要。text要设置为只读的-->
<input type="text" readonly="readonly" hvalue="1" value="男" style="width:200px" />
<input type="text" readonly="readonly" value="JavaScript,C#" style="width:200px" />