Question

我无法用js更改文本的颜色。显示和隐藏div标签工作正常，但颜色无法更改。顺便说一句，在我的css文件中没有这些链接的样式。

HTML：

    <ul>
    <li id="web_link"><a href="#">WEB</a></li>
    <li id="design_link"><a href="#">DESIGN</a></li>
    <li id="photo_link"><a href="#">PHOTO</a></li>
    </ul>

<div id="web_proekti">
 Some elements
</div>

<div id="design_proekti">
Some elements 
</div>  

<div id="photo_proekti">
Some elements 
</div>

Javascript文件：

$('#web_link').click(function()
{
    $('#web_proekti').show();
    $('#design_proekti').hide();
    $('#photo_proekti').hide();
    $('#design_link').css('color','#999');
    $('#photo_link').css('color','#999');

}
);

$('#design_link').click(function()
{
    $('#design_proekti').show();
    $('#web_proekti').hide();
    $('#photo_proekti').hide();
    $('#web_link').css('color','#999');
    $('#photo_link').css('color','#999');

}
);

$('#photo_link').click(function()
{
    $('#photo_proekti').show();
    $('#design_proekti').hide();
    $('#web_proekti').hide();
    $('#design_link').css('color','#999');
    $('#web_link').css('color','#999');

}
);

Answer 1

您正在更改<li>的颜色，而不是链接颜色。

要更改<a>的颜色，请尝试

 $('#photo_link a').css('color','#999');

而不是

 $('#photo_link').css('color','#999');

Answer 2

您必须通过在js中添加简单<a>的父ID后更改a标记本身的颜色：

$('#web_link').click(function()
{
    $('#web_proekti').show();
    $('#design_proekti').hide();
    $('#photo_proekti').hide();
    $('#design_link a').css('color','#999');
    $('#photo_link a').css('color','#999');

}
);

$('#design_link').click(function()
{
    $('#design_proekti').show();
    $('#web_proekti').hide();
    $('#photo_proekti').hide();
    $('#web_link a').css('color','#999');
    $('#photo_link a').css('color','#999');

}
);

$('#photo_link').click(function()
{
    $('#photo_proekti').show();
    $('#design_proekti').hide();
    $('#web_proekti').hide();
    $('#design_link a').css('color','#999');
    $('#web_link a').css('color','#999');

}
);

使用javascript更改文本（链接）颜色

2 个答案: