Question

我们正在使用JQuery UI lib进行一些非常有效的界面增强功能。但由于我们不需要支持IE6和其他旧浏览器，因此不需要像以下类这样的类：

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl

由JQuery UI添加。有没有办法告诉JQuery UI不要添加它们？从中删除样式没有问题，但是当你有很多空类时它看起来不太好。

Answer 1

这是实现这一目标的一种可能方式。

jquery ui小部件引发了一个'create'事件，该事件在执行_create（）和_init（）方法之间触发：

this._create();
this._trigger( "create" );
this._init();

此事件是从基础对象Widget引发的，因此它可供所有实现它的小部件使用。

'ui-corner-xxx'（和其他）的类通常在'_create（）'方法中创建，因此您可以将事件处理程序绑定到窗口小部件的'create'选项以删除这些类。类似的东西：

var classesToRemove = ['ui-corner-all', 'ui-corner-top',
    'ui-corner-bottom', 'ui-corner-right', 'ui-corner-left',
    'ui-corner-tl', 'ui-corner-tr', 'ui-corner-bl', 'ui-corner-br'];

var removeClassesCreateHandler = function(event, ui) {
    var that = this;
    $.each(classesToRemove, function(idx, val) {
        $('.' + val, that).removeClass(val);
    });
};

$("#accordion").accordion({
    create: removeClassesCreateHandler
});

以下是jsfiddle上的一个工作示例。

关于jQuery UI小部件的create事件

重要的是要注意并非所有jQuery ui小部件实际上都实现了Widget Factory（感谢上面的解决方案是可能的）。

因此，即使文档页面显示create选项，也不一定可用。

例如Datepicker的情况。它仍然依赖于相当旧的代码并且没有实现Widget工厂（但是 - 它计划被重构）。

Answer 2

我使用Dust-Me selectors删除了不必要的css。它真的帮助我摆脱了未使用的风格。

如何从JQuery UI中删除未使用的类

2 个答案: