href 在导航栏中不起作用.有人可以告诉我如何让它工作

href not working in navigation bar...can someone tell me how to make it work

本文关键字:告诉我 工作 导航 不起作用 href      更新时间:2023-09-26

css

.b1 {
    background-color:#FFFFFF;
}
.ls
{
    position:absolute;
    top:0px;
    left:165px;
}
.p1
{
    position:absolute;
    left:55px;
    top:0px;
    margin:0px;
    padding:200px;
}
.p2
{
    position:absolute;
    left:500px;
    top:400px;
    margin:0px;
    padding:200px;
}
ul
{
    list-style-type:none;
    background-color:#000000;
    margin:0;
    padding:0;
    overflow:hidden;
}
li
{
    float:left;
}
li a
{
    display:inline-block;
    color:white;
    text-align:center;
    padding:14px 16px;
    text-decoration:none;
}
.active
{
    background-color:burlywood;
}

.html

  • 蔬菜
  • 非素食
  • 甜点
  • 饮料
    <script>
        var myVeg=document.getElementById('myveg');
        myVeg.addEventListener('click', function(event){
                window.location.href='Veg_1.html';
            });
    </script>
</body>
您已

将 ID 设置为 li 。尝试将 ID 设置为a本身。这样,您的JS就知道用户何时单击了href。

.HTML

<ul>
    <li><a href="#home">Home</a></li>
    <li><a href="#veg" id="myveg">Veg</a></li>
    <li><a href="#Non-Veg" >Non-Veg</a></li>
    <li><a href="#Desserts" >Desserts</a></li>
    <li><a href="#Bevereges" >Beverages</a></li>
</ul>