返回首页

一个模拟下拉框【使用requirejs加载】

require(['../wfQuery'],function($){
    $.fn.Select = function(){
        return this.each(function(){
            var select = this, index = select.children[select.selectedIndex];
            var sel = $( '<a class="select-holder">'+'<strong>'+index.innerHTML+'</strong>' + select.innerHTML.replace(/(\<[\/]?)option/ig,'$1span')+'</a>' );
            $(select).before(sel).hide();
            $(document).on('click','.select-holder',function(e){
                $(this).toggleClass( 'expended' );
                var tar = $(e.target), show = $(this).children('strong');
                    value = tar.attr('value'), 
                    _sel = $(this).next();
                if( value ){
                    _sel.val( value );
                    show.html( tar.html() )
                }
            },function(e){
                $('.select-holder').removeClass( 'expended' );
            });
        });
    };
    var selected = false;
    $('#exec').on('click',function(){
        if( selected ){
            $('#favi, .select-holder').toggle();
        }else{
            selected = !selected;
            $('#favi').Select();
        }
        $(this).html( $(this).html() === "模拟" ? '重置' : "模拟" ); 
    });
});
Fork me on GitHub