尝试在同一页面的所有pragraph中添加(参见更多)但是当我多次添加代码时,它只能在一个pragraph中工作吗?
function showHide(shID) {
if (document.getElementById(shID)) {
if (document.getElementById(shID+'-show').style.display != 'none') {
document.getElementById(shID+'-show').style.display = 'none';
document.getElementById(shID).style.display = 'block';
}
else {
document.getElementById(shID+'-show').style.display = 'inline';
document.getElementById(shID).style.display = 'none';
}
}}
HTML CODE
<p>
<a href="#" id="example-show" class="showLink" onclick="showHide('example');">See more...</a>
</p>
<div id="example" class="more">
<p>Extra words.....</p>
<p><a href="#" id="example-hide" class="hideLink" onclick="showHide('example');">Hide.</a>
</p>
</div>
CSS
.more {
padding:0 3px 0 0;
display: none;
border: 1px solid #666;
}
a.showLink, a.hideLink {
text-decoration: none;
color: #36f;
padding-left: 8px;
background: transparent url('down.gif') no-repeat left;
}
a.hideLink {
background: transparent url('up.gif') no-repeat left;
}
a.showLink:hover, a.hideLink:hover {
border-bottom: 1px dotted #36f;
}
只有我可以使用一次。
如何在同一页面中多次使用它?
答案 0 :(得分:3)
你应该更改id,我猜你一遍又一遍地粘贴相同的代码而不改变id:
<p>
<a href="#" id="example-show" class="showLink" onclick="showHide('example');">See more...</a>
</p>
<div id="example" class="more">
<p>Extra words.....</p>
<p><a href="#" id="example-hide" class="hideLink" onclick="showHide('example');">Hide.</a>
</p>
</div>
<p>
<a href="#" id="example-show2" class="showLink" onclick="showHide('example2');">See more...</a>
</p>
<div id="example2" class="more">
<p>Extra words.....</p>
<p><a href="#" id="example2-hide" class="hideLink" onclick="showHide('example2');">Hide.</a>
</p>
</div>