《可输入下拉列表》jQuery插件

最近整了一个可输入下拉列表的jQuery插件出来了，以下是代码，以供各位同行参考或指点

 

/*
* InputSelect 1.0
* Copyright (c) 2010 Michael.Jiang  http://kongling.cnblogs.com/
* Date: 2011-08-24
* 使用InputSelect可以
*
*目前仅测试了jquery-1.6.2，其它版本的jQuery尚未测试，请谨慎使用
*参数说明：
*        msg：可选，数据输入错误时的提示消息
*        targetSelector：可选，下拉列表选中值的存储区域
*
*
*
*/

(function ($) {
    $.fn.InputSelect = function (options) {
        /// <summary>可输入下拉列表</summary>

        var defaultOption = {
            msg: "请输入正确数据!",
            targetSelector: null
        };
        var options = $.extend(defaultOption, options);

        this.each(function () {
            var current = $(this);
            current.css({ "marginLeft": "-150px" })
                            .wrap("<div style=\"position: relative;\"></div>")
                            .wrap("<span style=\"margin-left: 150px; overflow: hidden;\"></span>");
            var parent = current.parent().parent();
            parent.append($("<input type=\"text\" style=\"position: absolute; left: 0px;\" />").height(current.height() - 3).width(current.width() - 20));
            parent.find(":text").blur(function () {
                if ($(this).val() != "") {//不等于空
                    if (current.find("option:[value='" + $(this).val() + "']").prop("selected", true).change().length > 0) {

                    } else {
                        if (current.find("option:[text='" + $(this).val() + "']").prop("selected", true).change().length > 0) {

                        } else {
                            alert(defaultOption.msg);
                            current.prop("selectedIndex", -1);
                            $(this).val("").focus();
                        }
                    }
                } else {
                    current.change();
                }
            })
            .click(function () {
                $(this).val("");
            });

            current.change(function () {
                var text = current.find(":selected").text();
                parent.find(":text").val(text);
                if (defaultOption.targetSelector) {
                    $(defaultOption.targetSelector).val(text);
                }
            }).change();
        });
    }
})(jQuery);

下列代码为使用范例：

         $(function () {

            $("#ddlSel,#ddla").InputSelect({ msg: "输入错误" });
        });