0

Jquery Dialog我在我的 xhtml 页面中使用框。由于有 2 个Jquery Dialog盒子，每个盒子的外观和感觉都不同，我不得不使用addClass属性，这已经在这篇文章中讨论过了。现在我必须覆盖许多类，比如ui-dialog, ui-corner-all, ui-widget-headeretc。所以，我继续使用addClass. 代码如下，

$('.ui-widget-content').addClass('new-ui-widget-content');
$('.ui-widget').addClass('new-ui-widget');
$('.ui-dialog .ui-dialog-titlebar').addClass('new-ui-dialog new-ui-dialog-titlebar');
$('.ui-widget-header').addClass('new-ui-widget-header');
 $('.ui-helper-clearfix').addClass('new-ui-helper-clearfix');
 ....

$j("#dialog").dialog({
dialogClass: 'new-ui-widget-content',
dialogClass: 'new-ui-widget',
dialogClass: 'new-ui-dialog new-ui-dialog-titlebar',
dialogClass: 'new-ui-widget-header',
dialogClass: 'new-ui-helper-clearfix',
....

但是，我注意到只有 1 个类被覆盖。我的意思是说，虽然我已经覆盖了很多类，但只是new-ui-widget-content被覆盖（放在第一位）。

我也尝试过以下方式。但它给出了语法错误。

    $j("#dialog").dialog({
        dialogClass: 'new-ui-widget-content','new-ui-widget',......

可以覆盖多个类addClass吗？

如果是这样，它是如何做到的？

4

1 回答 1

0

你真的应该从 CSS 中覆盖不需要的样式，而不是通过 JavaScript 交换多个 CSS 类。您所需要的只是第二个对话框的一些标识符。如果#dialog是第一个，我猜第二个被命名为 something along #dialog2。

将第二个样式表文件添加到 HTML 页面或附加到原始jquery-ui-rev.css. 您的其他样式应该反映有问题的选择器，但前面有 a #dialog2，这增加了特异性并为名为 的包装器内的任何此类类设置特殊格式#dialog2。

由于我找不到jquery-ui-rev.css，我将根据jquery.ui.dialog.css.

如果你想覆盖 selector 的某些特定属性.ui-dialog，它是原始的：

.ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; }

…您可以通过设置另一个选择器来做到这一点，同时只重新指定适当的属性：

#dialog2 .ui-dialog {
    width: 500px;
}
于 2012-10-23T12:04:41.860 回答