JQuery Tabs - 在输入条目上更改选项卡的背景颜色

Posted 2023-05-08

【中文标题】JQuery Tabs - 在输入条目上更改选项卡的背景颜色

【英文标题】：JQuery Tabs - change background colour of tab on input entry

【发布时间】：2019-02-03 04:14:11

【问题描述】：

我正在创建一个简单的应用程序，它有 5 个选项卡和相应的 DIV，其中包含一些部件数据和两个输入字段。我想要实现的是，当有人在 .qty 输入中键入一个值时，它会更改当前选定选项卡的背景颜色 - 我用我目前拥有的代码创建了一个简单的小提琴；它是动态创建的，但我用静态数据创建了小提琴。

尝试改变我所做的背景；

$('.qty').on('keyup', function() 
    if ($(this).val().length > 0) 
    $('.ui-tabs-active').addClass('tab-ok');
  
)

但它什么也没做。我不确定我是否选择了正确的元素，但从搞砸它，我确实找到了实现它的方法，但它以非常糟糕的方式破坏了风格。

这样做的正确方法是什么？

Fiddle

【参考方案1】：

这是css specificity 的问题。您的颜色覆盖不起作用，因为它不够具体。您需要使用以下内容：

#tabs .tab-ok 
    background: red;

【讨论】：

或...背景：#ff0000 !important;

@gaetanoM 我不推荐使用!important，它充其量只是一个hack。

谢谢@Serg Chernata - 简直不敢相信这是如此简单的事情......花了几个小时玩 JQuery 只是为了尝试完成这项工作，完全忽略了它的 CSS 方面。