2012-01-25 2 views
0
(function($) { 

$.widget("ui.selectmenu", { 
    getter: "value", 
    version: "1.8", 
    eventPrefix: "selectmenu", 
    options: { 
    transferClasses: true, 
    typeAhead: "sequential", 
    style: 'dropdown', 
    positionOptions: { 
     my: "left top", 
     at: "left bottom", 
     offset: null 
    }, 
    width: null, 
    menuWidth: null, 
    handleWidth: 26, 
    maxHeight: null, 
    icons: null, 
    format: null, 
    bgImage: function() {}, 
    wrapperElement: "<div />" 
    }, 

    _create: function() { 
    var self = this, o = this.options; 

    // set a default id value, generate a new random one if not set by developer 
    var selectmenuId = this.element.attr('id') || 'ui-selectmenu-' + Math.random().toString(16).slice(2, 10); 

    // quick array of button and menu id's 
    this.ids = [ selectmenuId + '-button', selectmenuId + '-menu' ]; 

    // define safe mouseup for future toggling 
    this._safemouseup = true; 

    // create menu button wrapper 
    this.newelement = $('<a />', { 
     'class': this.widgetBaseClass + ' ui-widget ui-state-default ui-corner-all', 
     'id' : this.ids[ 0 ], 
     'role': 'button', 
     'href': '#', 
     'tabindex': this.element.attr('disabled') ? 1 : 0, 
     'aria-haspopup': true, 
     'aria-owns': this.ids[ 1 ] 
    }); 
    this.newelementWrap = $(o.wrapperElement) 
     .append(this.newelement) 
     .insertAfter(this.element); 

    // transfer tabindex 
    var tabindex = this.element.attr('tabindex'); 
    if (tabindex) { 
     this.newelement.attr('tabindex', tabindex); 
    } 

    // save reference to select in data for ease in calling methods 
    this.newelement.data('selectelement', this.element); 

이 생성 함수에서 동적으로 너비는 메뉴 만 브라우저 표준에 따라옵니다. 그래서 지금은 메뉴에 대한 너비 속성을 제거하려는 솔루션을 제공하십시오. jquery 요소. 스타일 문제

도는 폭이 아닌 경우 동적으로 경우 element.style {}

<a class="ui-selectmenu ui-widget ui-state-default ui-selectmenu-dropdown tinydrop tradedrop ui-state-active ui-corner-top" id="ui-selectmenu-3cab43ef-button" role="button" href="#" tabindex="0" aria-haspopup="true" aria-owns="ui-selectmenu-3cab43ef-menu" style="width: 97px; " aria-disabled="false"><span class="ui-selectmenu-status">Buy</span><span class="ui-selectmenu-icon ui-icon ui-icon-triangle-1-s"></span></a> 

답변

0

에서와 같이 인라인 스타일 폭 보여주는를 만드는 것 ..이 화재 버그에 표시하는 방법을 참조하십시오 다음 코드를 확인하세요 동적, 브라우저의 스타일을 수동으로 설정해야합니다 (예 : this ??)

여기서 배경색 값은 브라우저에 따라 설정됩니다.

<style type="text/css"> 
.ie .example { 
    background-color: yellow 
} 
.ie7 .example { 
    background-color: orange 
} 
.opera .example { 
    background-color: green 
} 
.konqueror .example { 
    background-color: blue 
} 
.webkit .example { 
    background-color: black 
} 
</style> 
+0

이 너비는 정적이 아니지만 동적이므로 코드가 작동하지 않습니다. – user1121019