0

我正在尝试制作一个 jQuery if 语句，它说：如果用户在指定的页面上，则应用指定的样式；在这种情况下，它会在锚标记的 id 上放置一个底部边框。

// index.php - referenced html
...
<link href='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript' />
<style type="text/javascript">
@import url('js/active-links.js');
</style>
...
<ul>
    <li><a id="home" href="#">HOME</a></li>
    <li><a id="other1" href="#">OTHER1</a></li>
    <li><a id="other2" href="#">OTHER2</a></li>
</ul>
...


// active-link.js 
$(document).ready(function() {
    if (document.URL.indexOf('index.php') >= 0) {
        $('#home').css('border-bottom: 18px solid #9cd588');
                                            }
                       });

理想情况下，如果陈述相同的事情，我将把它应用到每个带有 else 的链接。目前它什么也没做。

4

2 回答 2

1

简单的解决方案：

$('#home').css('border-bottom', '18px solid #9cd588');
于 2012-04-04T20:38:20.180 回答
0

你解决问题的方法是错误的。

在服务器端，从菜单中确定活动链接，并将active类名添加到活动菜单项。

$active = "Home";
...
echo "<li";
if ($active == "Home") { echo " class=\"active\" "; }
echo ">Home</li>";

然后，在你的 CSS 中，没有任何条件：

.active { border-bottom: 18px solid #9cd588; }
于 2012-04-04T20:53:56.123 回答