JQuery UI选项卡选择的背景不改变javascript

JQuery UI tabs selected background not changing javascript

本文关键字：背景 改变 javascript 选择 UI 选项 JQuery      更新时间：2023-09-26

我使用JQuery UI选项卡，像这样:

http://kyleschaeffer.com/web-controls/simple-jquery-tabs-template/

我遇到的问题是我有不止一组制表符。我有一个表与几行和交替的背景颜色白色/橙色。我希望选中的选项卡与背景的颜色相同，如果偶数行是橙色的，我希望选中的选项卡是橙色的，如果它是白色的，我希望选中的选项卡是白色的。

我使用的css是:

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
padding: 10px 20px 12px 20px;
background: #fff;
border-bottom-style: none;
  }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected-orange a {
padding: 10px 20px 12px 20px;
background: #ff9900;
border-bottom-style: none;
}

当前每个选定的选项卡显示为橙色。我如何使用JQuery或JavaScript知道背景是偶数/奇数，并相应地改变所选的选项卡颜色?

由于你的css的其余部分是未知的，我在猜测，它可能会使选定的选项卡透明:

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
    padding: 10px 20px 12px 20px;
    background: transparent;
    border-bottom-style: none;
}

或者，我猜你知道如果表行是奇数/偶数，并设置css-classes到行，如<tr class="odd">，然后尝试:

.odd .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
background: #yourOddColor;
}
.even .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
background: #yourEvenColor;
}
相关文章：