如何在HTML div中使用JavaScript OnBlur（）？

Question

I have a menu and I can open and close the menu clicking on a tag. It works. Also I use OnBlur(). Actually it works too but When I click a div in the menu, OnBlur active, menu closes and div's onclick doesn't works. How can I fix this problem ?

In JavaScript Codes;

<script>
  function Acc_Show() {
    var q = document.getElementById("he-my");
    q.style.display = "";
    document.getElementById("my-account-btn").focus();
    document.getElementById("my-account-btn").setAttribute("onclick", "Acc_Hide()");
  }
  function Acc_Hide() {
    var q = document.getElementById("he-my");
    q.style.display = "none";
    document.getElementById("my-account-btn").setAttribute("onclick", "Acc_Show()");
  }
</script>

In HTML codes;

<a id="my-account-btn" href="javascript:;" onclick="Acc_Show()" onblur="Acc_Hide()">My Account</a>

My Menu's Image;

http://i.stack.imgur.com/OMg6n.png

UPDATES Additional Codes From OP:

<div class="he-myac" id="he-my" style="display:none;">
  <div id="my-account-wrapper">
    <div class="myaccount" onclick="GoAdress('test.aspx')">Test</div>  
    <br/>
    <div class="myaccount" onclick="GoAdress('settings.aspx')" >Settings</div>
    <br/>
    <div class="myaccount" onclick="GoAdress('log_out.aspx')">Log Out</div>
  </div>

Answer 1

I have a feeling this line q.style.display = ""; in your Acc_Show() function is causing the issue. Try replace it with q.style.display = "block"; .

When an onblur event is triggered, your Acc_Hide() function hides your <div> by calling q.style.display = "none"; . Then the next click on my-account-btn triggers your Acc_Show() function, which set your q.style.display to an empty string. That doesn't unhide your <div> block.