如何更改 JQuery 按钮悬停在文本颜色上答案

【问题标题】：How to change JQuery button hover over text color如何更改 JQuery 按钮悬停在文本颜色上
【发布时间】：2019-10-15 12:49:13
【问题描述】：

我正在使用以下 css 在悬停时具有不同的颜色。 “.ui-button-text”工作正常，当模态出现但按钮悬停不起作用时显示正确的颜色。

.ui-button-text {
    color: #7a7d7e;
}

.ui-button-text ui-state-hover {
    color: black;
}

脚本

$("#dialog-confirm").dialog({
            resizable: false,
            height: "auto",
            width: "auto",
            modal: true,
            title: 'Cancelling Back Order Item',
            buttons: {
                "Ok": function () {
                    $(this).dialog("close");
                    return true;
                },
                Cancel: function () {
                    $(this).dialog("close");
                    return false;
                }
            }
        });

这里是 jsfiddle；

http://jsfiddle.net/7yukbsfe/1/

【问题讨论】：

你错过了一个 ' 。 ' 这里。 .ui-button-text ui-state-hover { color: black; } 。创建一个小提琴也会很有帮助。
创建小提琴将有助于理解您的查询。谢谢
jsfiddle.net/7yukbsfe/1

标签： javascript jquery html css jquery-ui

【解决方案1】：

您可以使用 CSS :hover 选择器，将您的 CSS 更改为：

.ui-button-text {
    color: #7a7d7e;
}

.ui-button-text:hover {
    color: black;
}

【讨论】：

你打败了我。
@user1263981：你能告诉我，你的浏览器控制台中抛出了什么错误信息吗？

【解决方案2】：

您的 CSS 太含糊，缺少目标。

用途：

.ui-dialog button.ui-button.ui-state-hover .ui-button-text {
  color: black;
}

小提琴：http://jsfiddle.net/Twisty/zfqs6wac/

ui-state-hover 类应用于.ui-button-text 的父级。

【讨论】：

【解决方案3】：

您可以只添加:hover 而不是.ui-state-hover。

这是fiddle。

【讨论】：

jQuery UI 自动将类添加到悬停状态，因此不必使用伪类。 OP 正在尝试利用这一点。