jQuery：选择后无法更改元素的样式答案

【问题标题】：jQuery: Cannot change style of element after selectedjQuery：选择后无法更改元素的样式
【发布时间】：2012-04-30 12:16:24
【问题描述】：

这是我的代码。在您看到“alert([...]);”的地方，会弹出一个警报。为什么 CSS 样式没有改变？ 'click' 事件也不会触发！

resolveSideMenuAddress: function () {
    var firstLink = $("#masterHeaderMenu .masterHeaderMenuButton a:first");

    function select(link) {
        alert('i alert');
        link.css({
            'color': '#9a4d9e',
            'cursor': 'default'
        });
        alert('color and cursor not changed');
        link.click(function () {
            alert('click');
            return false;
        });
    }

    if (window.location.pathname === firstLink.attr('href')) {
        alert('i alert');
        select(firstLink);
    }
}

我已经尝试过 addClass() 并且也无法以这种方式更改链接的颜色。

【问题讨论】：

您应该接受其他问题的一些答案，以鼓励人们努力做出回应。
您有两次相同的警报 - 您是否看到它弹出两次？
是的，我是。很好的问题。我很抱歉成为 jQuery 新手。
您应该发布元素的 dom 结构的基础知识（如一些示例 html）。另外，是否显示以下警报？ "alert('颜色和光标没有改变');"

标签： javascript jquery css

【解决方案1】：

首先，您实际上并没有触发点击事件，而是将点击处理程序应用于链接。在您实际单击链接之前，它不会触发。如果您想运行现有的点击处理程序，您可以尝试link.click()（没有该功能）。如果您希望实际获取链接，您只需将位置设置为链接的 href 属性的值。其次，我不确定为什么没有正确应用 CSS。在我看来没问题。我建议使用 Firefox/Firebug 并在函数运行后检查元素以查看实际使用的样式。

【讨论】：

我想他已经意识到了这一点，并说问题是即使点击链接也没有触发事件。

【解决方案2】：

尝试使用 $(link) 而不是链接像这样：

resolveSideMenuAddress: function () {
    var firstLink = $("#masterHeaderMenu .masterHeaderMenuButton a:first");

    function select(link) {
        alert('i alert');
        $(link).css({
            'color': '#9a4d9e',
            'cursor': 'default'
        });
        alert('color and cursor not changed');
        $(link).click(function () {
            alert('click');
            return false;
        });
    }

    if (window.location.pathname === firstLink.attr('href')) {
        alert('i alert');
        select(firstLink);
    }
}

【讨论】：