0

基本上我需要在同一页面上打开多个切换开关，而不是一次打开全部或一次只允许打开一个。用户在他们的头像下方有我想要隐藏/显示的奖励，但是我希望能够单击多个用户奖励并在同一页面上查看它们。

我知道我不应该使用 ID，因为我希望每页打开多个 ID，但是我不确定如何在没有它们的情况下重做代码。

jQuery：

function toggle() {
var ele = document.getElementById("awardtoggle");
var text = document.getElementById("showcontent");
if(ele.style.display == "block") {
        ele.style.display = "none";
    text.innerHTML = "";
}
else {
    ele.style.display = "block";
    text.innerHTML = "";}}

HTML：

<a id="showcontent" href="javascript:toggle();"><div class="awards">Award Box</a></div><div id="awardtoggle" style="display:none; margin-top:-83px;"><!-- |awards| --></div>

CSS：

.awards {position: relative; top:-65px; text-align: center; background: #444642; color: #fff; text-transform: uppercase; font-family: Oswald; font-size: 10px; padding: 2px; line-spacing: 2px;} .awards a:link { color: #fff;} .awards a:visited { color: #fff;} .awards a:hover, .awards a:active {color: #fff;}
4

1 回答 1

0

做类似的事情

<a class="showcontent" href="#">
    <div class="awards">Award Box</div>
</a>
<div class="awardtoggle" style="display:none; margin-top:-83px;">
    <!-- |awards| -->
</div>

然后

jQuery(function(){
    $('.showcontent').click(function(e){
        $(this).next().toggle();
        e.preventDefault();
    })
})
于 2013-09-18T08:10:14.863 回答