Question

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

我知道我不想使用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;}

Answer 1

执行类似

的操作

<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();
    })
})

切换没有id，因此多个将在同一页面上打开

1 个答案: