Question

我正在尝试使用jquery从菜单导航。我的页面此时显示1个部分，所有页面包含3个部分。我想点击菜单部分后淡出当前部分并加载cliccked部分。

我的代码如下：

       <nav class="navbar navbar-static-top top_menu  ">
            <ul class="nav navbar-nav">
                <li class=" " >
                    <a href="#glowna">Main page
                        <i class="glyphicon glyphicon-send"></i></a>
                </li>
                <li class=" " >
                    <a href="#projekty" >Forums
                        <i class="glyphicon glyphicon-wrench"></i></a>
                </li>
                <li class="" >
                    <a href="#kontakt">Contact
                        <i class="glyphicon glyphicon-info-sign"></i></a>
                </li>
            </ul>
        </nav>


<section id="main page" ></section>
<section id="Forum" ></section>
<section id="Contact" ></section>

脚本

$('a').click(function(){
  $('section').fadeOut(400);
  $('section #'+this).fadeIn(400);
});

Answer 1

您需要使用id或this.id或$(this).attr('id')获取所点击锚点的$(this).prop('id')：

$('a').click(function(){
    $('section').fadeOut(400);
    var id = this.id; //  or $(this).attr('id') or $(this).prop('id')
    $('section #'+id).fadeIn(400);
});

您可以详细了解attr()和prop()。

Answer 2

终于来了。它像这样工作

$('a').click(function(){
   $('section').fadeOut(400);
   var id = $(this).attr('href');
   $(id).fadeIn(400);
});

jquery菜单淡出部分

2 个答案: