如何从特定元素中删除/添加jQueryUI CSS主题？

Question

我有一个jQueryUI选项卡应用于同一页面的两个不同元素的WordPress网站。但是，我希望这些元素中的一个为主题，另一个不是。

我试过使用.removeClass（'ui-widget'），但它当然会在应用jQueryUI之后删除类，所以它与无所作为一样。

解决此问题的另一种方法可能是将主题应用于仅一个选项卡，但我也不知道如何执行此操作。

在此先感谢。

Answer 1

你的意思与 “不为主题的” 是什么？jQuery UI的标签始终的主题。如果你想区分两个不同的选项卡，你可以应用自己的自定义_CSS来覆盖你的UI主题。 这是创建标签的标记（从文档拍摄）

<div class="ui-tabs ui-widget ui-widget-content ui-corner-all" id="tabs"> 
    <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all"> 
    <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-1">Nunc tincidunt</a></li> 
     <li class="ui-state-default ui-corner-top"><a href="#tabs-2">Proin dolor</a></li> 
    <div class="ui-tabs-panel ui-widget-content ui-corner-bottom" id="tabs-1"> 
     <p>Tab one content goes here.</p> 
    </div> 
    ... 
</div> 

注：这是由标签插件所产生的标记的样本，而不是标记，你应该用它来创建一个标签。唯一需要的标记是

<div id="tabs"> 
    <ul> 
     <li><a href="#tabs-1">Nunc tincidunt</a></li> 
     <li><a href="#tabs-2">Proin dolor</a></li> 
     <li><a href="#tabs-3">Aenean lacinia</a></li> 
    </ul> 
    <div id="tabs-1"> 
     <p>Tab 1 content</p> 
    </div> 
    <div id="tabs-2"> 
     <p>Tab 2 content</p> 
    </div> 
    <div id="tabs-3"> 
     <p>Tab 3 content</p> 
    </div> 
</div>. 

您可以使用元素的id来设置样式。

#tabs ul li{ 
    background-color: green; 
} 

Answer 2

每个控件有点不同，但其中大多数都有一个destroy method。例如，为了从一个按钮小部件移除造型和行为：

$("#yourButton").button("destroy"); 

另一种选择是覆盖CSS类针对该特定元素。这不会影响窗口小部件的行为。

​​3210

Answer 3

试过这个？：

$(tab_not_theme).removeClass('ui-tabs'); 
$(tab_not_theme).removeClass('ui-tabs-nav'); 
$(tab_not_theme).removeClass('ui-tabs-panel');