Question

我正在使用jQueryUI开发一个应用程序。我也在使用Themeroller。我希望尽可能多地使用主题定义我的样式，这样如果我需要更改某些样式，我只需创建一个新的自定义主题（或下载现有主题）。

我正在尝试在jQueryUI中使用“可选”交互。它正常工作 - 在Firebug中我可以看到“ui-selected”类应用于我选择的元素。但是，没有视觉提示已选择该项目。我查看了主题CSS文件（jquery-ui-1.8rc3.custom.css，我是从Themeroller page下载的），我看不到“ui-selected”类的声明。当我下载jQueryUI和主题时，我检查了每个选项，包括“可选”的选项。

如何让我的主题定义“ui-selected”类？显然，我可以创建自己的样式声明，但如果我想要更改主题，那么该解决方案并不理想。

我正在使用jQuery 1.4.2和jQueryUI 1.8rc3。

Answer 1

您可以动态设置ui类：

$("#selectable ul").selectable({
  unselected: function(){
    $(".ui-state-highlight", this).each(function(){
      $(this).removeClass('ui-state-highlight');
    });
  },
  selected: function(){
    $(".ui-selected", this).each(function(){
      $(this).addClass('ui-state-highlight');
    });
  }
});
$("#selectable li").hover(
  function () {
    $(this).addClass('ui-state-hover');
  }, 
  function () {
    $(this).removeClass('ui-state-hover');
  }
);

Answer 2

抱歉，答案很糟糕，但你不能。

这是ThemeRoller必须添加的功能，您无法自动添加任何生成的样式。

如果查看demo pages，他们还会手动为.ui-selected

制作样式声明

jQueryUI selectable：无法将主题应用于所选项目（“ui-selected”类）

2 个答案: