Question

我有一个菜单，我可以点击标签打开和关闭菜单。有用。我也使用OnBlur（）。实际上它也有效但当我点击菜单中的div时，OnBlur处于活动状态，菜单关闭，而div的onclick不起作用。我该如何解决这个问题？

在JavaScript代码中;

<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>

在HTML代码中;

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

我的菜单图片;

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

更新来自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

我感觉q.style.display = "";函数中的这一行Acc_Show()导致了问题。请尝试将其替换为q.style.display = "block";。

当触发onblur事件时，您的Acc_Hide()功能会通过调用<div>来隐藏q.style.display = "none";。然后，下一次点击my-account-btn会触发您的Acc_Show()功能，该功能会将您的q.style.display设置为空字符串。这并不会取消隐藏<div>阻止。

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

1 个答案: