select 转换

/**
* 把原始的select转换成div和input的形式。
**/

(function($){
    $.fn.xcySelect = function(options){

        var defaults = {
            hiddenInput : null
            ,showInput : null
            ,readonly   : true
            ,width      : 100
            ,height     : 40
            ,dropIcoImg : ""
            ,className : ""
            ,width      : 100
            ,inputOver : ""
            ,inputOut   : ""
            ,divOver    : ""
            ,divOut     : ""
            ,onclick    : null
        }
        defaults = $.extend({},defaults, options, {_showDivClass:"",_showInputClass:"selectInput"});

        $(this).each(function(){
            var $objSelect = $(this);
            if($(this).attr("tagName").toLowerCase() == "select" ){
                setInput(defaults,$objSelect);
            };
        });
    };

    function setInput(defaults,$objSelect){
        defaults['hiddenInput'] =   $(this).attr("name") || defaults['hiddenInput'] || "";
        defaults['showInput'] = ($(this).attr("name") || defaults['showInput'] ||   "")+ "_show";
        var $hiddenInput = $("<input type = 'hidden' />").attr("name",defaults['hiddenInput']);
        var $showInput = $("<input readonly type = 'text' />").attr("name",defaults['showInput']).addClass(defaults['_showInputClass']);
        $showInput.addClass($objSelect.attr("class") || defaults['className'] || "");

        var selectedOption = $(":selected",$objSelect);
        if(selectedOption.length = 1){
            setDefaultVal(selectedOption, $showInput, $hiddenInput);
        }

        $showInput.blur(function(){
            inputBlur($(this),$hiddenInput);
        });


        $hiddenInput.insertAfter($objSelect);
        $showInput.insertAfter($objSelect);
        setList(defaults, $objSelect, $showInput, $hiddenInput);
        // 删除页面中select
        $objSelect.remove();
    };

    function setDefaultVal($selectedOption, $showInput, $hiddenInput){
        $showInput.val($selectedOption.text());
        $hiddenInput.val($selectedOption.val());
    };

    function inputBlur($src, $dest){
          $dest.val($src.val());
    };

    function setList(defaults, $objSelect, $showInput, $hiddenInput){
        var $div = $("<div class='selectDiv'></div>").addClass(defaults['_showDivClass']);
        $div.mouseover(function(){
            $showInput.addClass('selectInputOver');
        }).mouseout(function(){
            $showInput.removeClass('selectInputOver');
        }).hover(function(){
            $("div.selectDivHover",$div).removeClass("selectDivHover");
        },function(){});
        // 设置下面的显示屋的width和上面的input一致
        var width = getElementWidth($showInput);
        $div.css({'width':width});
        $div.data("options",$("option",$objSelect).length);

        $div.data("dir",$objSelect.attr("selectedIndex") || 0);
        //
        $("option",$objSelect).each(function(index){
            var $optionDiv = $("<div></div>");
            var $option = $(this);
            var optionValue = $option.attr("value");
            var optionText = $option.text();

          &n

补充：web前端 , JavaScript ,