点击其他地方时切换不起作用

Question

我有一个链接，点击后会切换两个显示开/关状态的div。使用以下方法可以正常工作。

我遇到的问题是当点击另一个链接时，它仍处于该状态 - 所以当点击链接时它显示为on，当点击其他地方的链接时，它需要显示为关闭。

这怎么可能？

    $('.toggle').click(function(e) {
        e.preventDefault();

        $('.closer', this).toggle();
        $('.opener', this).toggle();

    });

对于某些情况：

<li>
    <a class="toggle dot-link-<?php echo $count; ?>" data-number="<?php echo $count; ?>" href="javascript:void(0);"><?php the_sub_field('title'); ?>
        <span class="opener">+</span><span class="closer">-</span>
    </a>
    <span class="inner">
        <?php the_sub_field('content'); ?>
    </span>
</li>

Answer 1

试试这个。

$('.toggle').click(function(e) {
    e.preventDefault();

    //close all the others open, that don't belong to this toggle
    $('.toggle').not(this).find('.closer').removeClass('closer').addClass('opener');

    //toggle this one
    $('.closer', this).toggle();
    $('.opener', this).toggle();
});