第一次訪問後隱藏div

我有一個按鈕（B）顯示了一個菜單（C），點擊時彈出（A）也顯示了同樣的菜單（C）。
我需要在這裏做4件事。

1）單擊B時，出現C.
2）單擊A時，出現C.
3）當點擊B時，A變爲隱藏
4）第一次訪問後A變爲隱藏。（像一個歡迎消息）

但是，它似乎並沒有工作，如果我添加腳本的第一次訪問（我在這裏使用localStorage）。誰能知道哪裏出了問題？此外，我是新來的JavaScript，所以我只是在網上尋找代碼，並添加他們，看看他們的工作。我不確定是否有任何方法可以使代碼更好？（現在它們全部分開）。謝謝。
第一次訪問後隱藏div

這裏是我的代碼

<div class="user-menu-group"> 
    <a href="javascript:void()" onclick="hide('1sttime')" class="open-user-menu">B 
     <div class="notification" id="1sttime"> 
     <p>A</p> 
     </div> 
    </a> 
    <div class="user-menu-bs">C</div> 
</div>

這裏是我的腳本

  <!--first time message--> 
      <script> 
      $(document).ready(function() { 
       if (localStorage.getItem('wasVisited') !== undefined) { 
        $("#1sttime").hide(); 
       } else { 
        localStorage.setItem('wasVisited', 1); 
        $("#1sttime").delay(5000).fadeOut(500); 
       } 
      }); 
      </script> 

      <!--hide A after clicking B--> 
      <script> 
      function show(target) { 
       document.getElementById(target).style.display = 'block'; 
      } 

      function hide(target) { 
       document.getElementById(target).style.display = 'none'; 
      } 
      </script> 

      <!--hide A after clicking it--> 
      <script> 
      (function() { 
       var elements = document.getElementsByClassName('notification'); 
       for (var i = 0; i < elements.length; i++) { 
        elements[i].addEventListener('click', function() { 
         this.style.display = 'none'; 
        }); 
       } 
      })(); 
      </script>

來源

2016-08-23 user3769516

爲什麼jQuery的的結構和普通的JS？ – nnnnnn

@nnnnnn對不起，不知道如何做只有JS。特別是第一次參觀部分。 – user3769516

試試這個：你可以爲A和B的一個單一的點擊處理程序，隱藏和點擊後顯示溫度。

$(function(){ 
 
    $('.open-user-menu, .notification').click(function(){ 
 
    $('.notification').hide(); 
 
    $('.user-menu-bs').show(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="user-menu-group"> 
 
    <a href="javascript:void()" onclick="hide('1sttime')" class="open-user-menu">B 
 
     <div class="notification" id="1sttime"> 
 
     <p>A</p> 
 
     </div> 
 
    </a> 
 
    <div class="user-menu-bs" style="display:none">C</div> 
 
</div>

來源

2016-08-23 04:25:28

非常感謝！但是，第一次訪問部分仍然不起作用。但我在你們的幫助下將兩者結合起來。謝謝。 – user3769516

高興地幫助你:)根據你的要求，當用戶點擊A或B時，A被隱藏，並且沒有機會再次點擊A.因此，我保持單擊處理程序，其中A被隱藏並且C可見。讓我知道我得到了錯誤的要求。 –

第一次訪問後隱藏div

回答

相關問題