Question

 $('.open').click(function() {
      $('.sidebar').toggleClass('sidebar-open');
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="open">Open</span>
    <div class="sidebar">
      <div class="sidebar-inner">
      </div>
    </div>

除了一个特定的页面，这在任何地方都可以正常工作。在Firefox检查器中，我可以看到“侧边栏”类被突出显示为它的目标，但它没有添加“侧边栏打开”类...

为了测试一下，我尝试将目标更改为侧边栏 - 内部div，这非常合适。

有谁知道这里会发生什么？

Answer 1

这是一个（plunk）[https://plnkr.co/edit/9GAJnyJY6rqEbNHtjWv4?p=preview]与完全相同的代码，它在chrome和ff上正常工作。

确保在加载html后执行click绑定。也许将绑定包装在这样的$(document).ready中：

$(document).ready(function(){
      $('.open').click(function() {
        $('.sidebar').toggleClass('sidebar-open');
      });
    })

Answer 2

您可以在检查器标签中看到要突出显示的元素，这意味着它正在被更改，并且您已正确添加事件（在文档准备好之后）并且没有错误在代码本身

如果您碰巧两次添加了相同的点击事件，那么最终结果将与您观察到的完全一致

toggleClass不能处理特定的div

2 个答案: