我有这个代码:
<head>
<link rel="stylesheet" href="style.css" type="text/css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<script type="text/javascript">
function toggleDiv(divId) {
$("#"+divId).toggle();
}
</script>
<a href="javascript:toggleDiv('myContent');">Show comments</a><br>
<div id="myContent">
My text1
</div>
<a href="javascript:toggleDiv('myContent');">Show comments</a><br>
<div id="myContent">
My text2
</div>
<a href="javascript:toggleDiv('myContent');">Show comments</a><br>
<div id="myContent">
My text3
</div>
我的style.css代码:
#myContent {
display: none;
}
我希望当我单击第一个显示评论时，显示第一个文本(我的文本1)，然后单击第二个显示评论，显示第二个文本(我的文本2)，然后我单击第三个显示评论，即第三个文本(我的文本3)。 而这样的代码很多。
怎么做，那不是: 点击第二个显示评论不向我显示第一个文本，而是向我显示第二个文本？如何适应？
最佳答案
使用上一个或下一个 jquery:
<a class="showMessage">Show comments</a>
<div class="myContent">
My text1
</div><br><br>
<a class="showMessage">Show comments</a>
<div class="myContent">
My text2
</div><br><br>
<a class="showMessage">Show comments</a>
<div class="myContent">
My text3
</div>
$(".showMessage").click(function(ev){
$(this).next().toggle();
})
示例: https://jsfiddle.net/zm3Lg85a/?utm_source=website&utm_medium=embed&utm_campaign=zm3Lg85a
关于javascript - 如何使用javascript，当点击href时，它显示文本？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39046608/