Question

我注意到如果你有以下

<div class="ui-widget-content">
   <div class="ui-icon ui-icon-plus"></div>
</div>

并将ui设为一个按钮

$('.ui-icon').button();

它并没有真正起作用，因为ui-widget背景混淆了按钮图标。 :( 有谁知道这个bug？

被修改 问题是background上ui-widget-content处理背景位置及其背景网址

Answer 1

我找到了一个工作但不是很漂亮

$.each('.ui-icon',function(i,n){
    var iconclass= $(n).attr('class');
    $(n).removeAttr('class');
    $(n).button({
        icons:{
            primary: iconclass
        }
    });
});

Answer 2

问题在于“交互状态”的选择器将所有背景属性汇总到一个声明中，这使得子选择器无法覆盖单个属性：

原作如下：

    .ui-state-default, 
        .ui-widget-content .ui-state-default, 
        .ui-widget-header .ui-state-default { 
            border: 1px solid #dddddd;
            background: #f6f6f6 url(images/ui-bg_highlight-soft_100_f6f6f6_1x100.png) 50% 50% repeat-x; 
            font-weight: bold; 
            color: #0073ea; 
      }

将背景分解为两个单独的声明，它可以工作：

    .ui-state-default, 
        .ui-widget-content .ui-state-default, 
        .ui-widget-header .ui-state-default { 
            border: 1px solid #dddddd;
            background-color: #f6f6f6; 
            background-image: url(images/ui-bg_highlight-soft_100_f6f6f6_1x100.png) 50% 50% repeat-x; 
            font-weight: bold; 
            color: #0073ea; 
      }

N.B。这与你使它成为一个按钮（）的事实无关 - 它只发生在HTML / CSS位上。

Answer 3

我不知道<DIV>(s)可以初始化为按钮。

<div class="ui-icon ui-icon-plus"></div>

jquery ui-widget-content按钮错误

3 个答案: