如何覆盖jQuery UI小部件样式并保持function

我正在使用jQuery UI进行内部应用程序。

我正在寻找一种简单的方法来删除jQuery UI在给定的小部件实例上提供的所有样式信息。我对任何事情都持开放态度，但可重复使用的JavaScript解决方案将是完美的。绝对必要的是不丢失任何function。

最重要的是 删除了所有背景图像，我保持布局样式。

理想情况下……

$tabs = $("#someElement").tabs(); $tabs.removeStyles();

但我愿意接受任何允许我以灵活的方式修改小部件样式的内容。

最终目标是尽可能多地控制样式

要覆盖jquery-ui css，请使用!important标记。

 .ui-dialog { background-color: black !important; }

删除CSS样式/类的更简单方法是使用。 removeClass() 。例如，要覆盖选项卡的所有角落并且只有顶角，我会像这样使用它：

 $('#tabs').tabs().removeClass('ui-corner-all').addClass('ui-corner-top');

希望这可以帮助！

您可以轻松创建自己的removeStyles函数。

 $.fn.removeStyles = function(){ $(this).attr('class',''); };

这将从您选择的元素中删除所有样式。

编辑：如果您只想删除jquery ui创建的类，则您的选项有限。您可以将class属性中的类与您键入的jquery-ui类列表进行比较。没有灵丹妙药可以自动删除jquery ui。

你可以删除css文件并开始只用你想要的布局重建它。这是很多工作，但这是它带来的价格……