Question

很抱歉，如果这是一个愚蠢的问题，我对JS / JQuery很新，并且不知道我的问题是否只是一个简单的答案。

我有两个切换div，或多或少设置如下（这是精简版）：

<div id="top-story-panel">
  <div id="story-toggle">
    <ul>
      <li id="top-stories">
        <a href="#" class="current-link">Top Stories</a>  
      </li>
      <li id="toc">
        <a href="#">All Stories</a>
      </li>
    </ul>  
  </div> 
</div>

<div id="toc-panel">
  <div id="story-toggle">
    <ul>
      <li id="top-stories">
        <a href="#" class="current-link">Top Stories</a>  
      </li>
      <li id="toc">
        <a href="#">All Stories</a>
      </li>
    </ul>  
  </div>
</div>

使用此功能，两个div可以顺畅地来回切换，但是如果你点击其中一个切换（＆＃34;顶级故事＆＃34; /＆＃34;所有故事＆＃34;分别）然后点击它再次隐藏它刚刚显示的div ...并且无法找到任何其他替换它。现在隐藏了两个div，用户无法与div进行交互。

jQuery(function($) {
var $contentPanel= $('#top-stories-panel, #toc-panel')
    $toggle= $("#top-stories, #toc");

$toggle.on('click', function(e) {
    var $id;
    e.preventDefault();
    $icons.removeClass('hidden');
    $id=$('#'+this.id+'-panel'); //get menu id 
    $contentPanel.fadeOut(10);
    if(! $id.is(':visible')) {
        $id.fadeIn(450)
            preloadImages: 'all';
        $(this).addClass('hidden');
    }
    });
});

我假设如果我将切换器放在他们各自的div之外，我就不会遇到这个问题 - 但是有一个代码解决方法让切换器留在div中吗？

非常感谢你的帮助; _;

JS Toggle隐藏所有切换的div - 使页面无法正常工作

0 个答案: