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

Question

我们正在使用JQuery UI库进行一些接口增强，这很好。但是，由于我们不需要支持IE6和其他旧浏览器，所以不需要使用以下类：

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

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

Answer 1

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

jquery小部件引发在执行_create()和_init()方法之间触发的“create”事件：

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

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

“ui-角-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
});

下面是小提琴上的一个工作示例。

关于create UI小部件的事件的

需要注意的是，并非所有的jQuery ui小部件实际上都实现了widgets (感谢上面的解决方案是可能的)。

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

举个例子，这就是数据报警器的情况。它仍然依赖于相当老的代码，并且没有实现Widget工厂(但是--计划重构它)。

Answer 2

我使用灰-我选择器来删除不必要的css。它真的帮了我很大程度上摆脱了未使用的风格。