我希望能够在按下按钮时更改两个 div 中的内容。选择玩家名称后,一个 div 需要更新他们的简历,下一个 div 需要更新他们的照片。目前,一旦选择了按钮,它就会将相同的内容加载到两个 div 中。
<section id="container">
<div id="playerMenu">
<nav>
<h3>Select a Player</h3>
<ul>
<li><a href="adnan" >Adnan Januzaj</a></li>
<li><a href="movie-2">Movie 2</a></li>
<li><a href="movie-3">Movie 3</a></li>
</ul>
</nav>
</div>
<article class="playerPic">
<section id="picture">
<div id="adnan1">
<img src="images/januzaj.png"/>
</div>
</article>
<div class="playerBio">
<section id="content">
<div id="adnan">
<p> Bio about Adnan Januzaj Here</p>
</div>
</div>
</section>
</section>
</section>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$('#playerMenu ul li a').click(function(){
$('#content').load('players.html #' + $(this).attr('href'));
return false;
});
$('#playerMenu ul li a').click(function(){
$('#picture').load('players.html #' + $(this).attr('href'));
return false;
});
});
</script>
我正在调用一个名为 players.html 的单独 html 文件中的信息和图片
<div id="adnan">
<h2>Adnan Januzaj</h2>
<p>Bio about Adnan Januzaj Here</p>
<div id="adnan1">
<img src="images/januzaj.png"/>
</div>
</div>
<div id="movie-2">
<h2>Phil Jones</h2>
<img src="images/jones.jpg"/>
<p>Bio about Phil Jones Here.</p>
</div>
这可能吗?我知道如何更改一个 div 的内容,但是通过选择一个按钮是否可以更改 2 个 div 的内容?一个导航按钮可以包含多个 href 吗?
谢谢!
最佳答案
您可以将两个更改放在同一个事件监听器中:
$('#playerMenu ul li a').click(function(){
$('#content').load('players.html #' + $(this).attr('href'));
$('#picture').load('players.html #' + $(this).attr('href'));
return false;
});
关于javascript - 改变多个div的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22919428/