-1

好的，所以我有一些 jQuery 代码用于让标签工作。

"active"现在这是我的问题，当有人单击切换时，我希望切换它自己添加一个类。我不想要内容上的活动类，而是切换。

这是我的 jQuery 代码

function toggleMeMirror(a){

// hide all

jQuery('.episodemirrors').hide();

//  show one

var e=document.getElementById(a);

if(!e) return true;

    if(e.style.display=="none"){  

        e.style.display="inline"

    } else {

        e.style.display="none"

    }

return true;

}

这是我的切换 HTML 代码.. 不是内容。

<div id="post-<?php the_ID(); ?>" onclick="return toggleMeMirror('post-<?php the_ID(); ?>')" >Toggle</div>

这是我想要活动类的地方，所以active当有人点击它时可能会创建这个类，这样我就可以设置不同的样式。

这是我的内容的 HTML

<div id="post-<?php the_ID(); ?>" class="episodemirrors"> Content </div>

4

2 回答 2

0

我认为最简单的方法是这样：

html:

<div class="spoiler">
     <div class="toggle">Toggle</div>
     <div class="content">Content</div>
</div>

CSS：

.spoiler .content {
    display: none;
}

js：

$(".spoiler .toggle").click(function(){
    $(".spoiler .toggle.active").removeClass("active").next().hide();
    $(this).toggleClass("active");
    $(this).next().toggle();
})
于 2013-06-12T22:43:28.133 回答
0

您使用 jQuery，并且您有一个唯一的切换器 ID。因此，您可以在现有函数中执行此操作：

$('.post-[id]').addClass('active');

不过一些建议：

  1. 由于您的切换器类具有唯一的 id，您可能希望它们使用 id 而不是类。

  2. 您可以使用 jQuery 的 toggleClass 代替 e.style.display，它会为您跟踪添加和删除类。每当您触发该函数时，您首先隐藏所有类，因此您可以打开该 div 的显示。

  3. 由于您使用 jQuery，因此您也可以使用它来触发点击。

基于您的代码的简单示例：

<div class="trigger" id="[id]">Toggle</div>

$('.trigger').click(function(){
    $('.episodemirrors').hide();
    var id = $(this).attr('id');
    $('#post-'+id).css('display', 'inline');
});
于 2013-06-12T22:18:46.053 回答