gpt4 book ai didi

javascript - 显示和加载一次

转载 作者:行者123 更新时间:2023-11-28 07:55:19 25 4
gpt4 key购买 nike

我遇到的问题是我只想显示被点击的页面,如果我点击(a#dashboard)然后点击(a#stats),内容会重叠..

如何防止内容重叠?我想要的是,如果我点击 (a#stats),那么 (a#dashboard) 和 (a#log) 必须处于空闲状态。

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a id = "DataOne"><span class="glyphicon glyphicon-home" style="font-size:25px;" aria-hidden="true"></span></a></li>
<li><a id = "DataTwo"><span class="glyphicon glyphicon-list-alt" style="font-size:25px;" aria-hidden="true"></span></a></li>
<li><a id = "DataThree"><span class="glyphicon glyphicon-stats" style="font-size:25px;" aria-hidden="true"></span></a></li>
</ul>
</div>
</div>
</nav>

<script type="text/javascript">

$('a#dashboard').on('click',function(){
$("#page1").load("page1.html");
});

$('a#log').on('click',function(){
$("#page2").load("page2.html");
});

$('a#stats').on('click',function(){
$("#page3").load("page3.html");
});

</script>

@Lelio Faieta,这是三个div的HTML,我把page1.html的内容放在下面。index.html

         ......
<script>
$(function(){
$("#TopMenu").load("TopNavigationBar.html");
});
</script>
</head>
<body>
<div id="TopMenu"></div>
<div id="page1"></div>
<div id="page2"></div>
<div id="page3"></div>
</body>

page1.html

<script type="text/javascript">
$("#dashboard").load("dashi.html");
</script>

<div>
<div id="dashboard"></div>
</div>

最佳答案

为所有三个 div 添加一个公共(public)类,并在加载内容之前将它们全部清空。所以:

$('a#dashboard').on('click',function(){
$('.pages').empty();
$("#page1").load("page1.html");
});
$('a#log').on('click',function(){
$('.pages').empty();
$("#page2").load("page2.html");
});

$('a#stats').on('click',function(){
$('.pages').empty();
$("#page3").load("page3.html");
});

关于javascript - 显示和加载一次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30143314/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com