jquery - 如何使toggle()在jQuery中工作

我在有关jQuery的书中遇到问题。我有以下HTML：

<div id="switcher" class="switcher">
  <h3>Style Switcher</h3>
  <button id="switcher-default">Default</button>
  <button id="switcher-narrow">Narrow</button>
  <button id="switcher-large">Large</button>
</div>

并试图通过单击标题来使按钮切换开/关。这是jQuery：

$(document).ready( function () {
 $('#switcher h3').toggle(function() {
   $('#switcher button').addClass('hide');
}, function(){
   $('#switcher button').removeClass('hide');
});

由于某些原因，H3元素（标题）在页面加载时立即隐藏，而我无法选择它。真的，按钮应该是隐藏的，不是H3，对不对？

这是CSS：

.hide {
    display: none;
}

最佳答案

toggle事件方法已从jQuery 1.8开始弃用，并已在jQuery 1.9中删除，jQuery 1.9使用toggle显示方法并隐藏了您的元素。

您可以改用click和toggle效果方法：

$(document).ready( function () {
   $('#switcher h3').click(function(){
       $(this).siblings('button').toggle();
   })
});

关于jquery - 如何使toggle()在jQuery中工作，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14864296/