onBlur 事件阻止 onClick 事件

Question

我有一个带有 onfocus 和 onblur 事件的输入文本框。文本框下方是一个 div，通过 display: none 隐藏。如果文本框获得焦点，则应显示 div；如果文本框模糊，则应隐藏该 div。这似乎有效。现在，我想让 div 保持可见，或者如果我单击 div（或其内容之一）本身，则可以对 div 进行任何单击。这是行不通的。onBlur 事件阻止 div 上的任何事件。我已经尝试确定单击了哪个新元素，但找不到任何对我有帮助的属性。相关目标为 NULL。此时，对我来说唯一的解决方案似乎是在除 div 及其子节点之外的每个其他节点上添加 onfocus除了这个你还有其他的想法吗？感谢您的帮助。延斯

Answer 1

onmousedown之前活跃onblur

div.addEventListener('mousedown', function(event) {

   event.preventDefault();

   event.stopPropagation();

});

Answer 2

当 onblur 运行时，它将隐藏 div，因此当要进行单击时，它不会在 div 上触发，因为 div 是不可见的。所以 ：

 // use the following global variable

   var mytimer = null;

  

  function newOnBlur()

  {

     mytimer = setTimeout(YourCurrentOnBlurFunctionWihoutParentheses,150);

  }

  

  // clearTimeout in the first line of your click function

  function newOnClick()

  {

     clearTimeout(mytimer);

     //  rest of your click event

  }

Answer 3

全局变量看起来有点难看，但这似乎是做到这一点的唯一方法。

对于那些有同样问题的人： setTimeout 在我的例子中有点迂腐。我必须以这种方式设置它，否则永远不会使用超时：

var timer = null;

function timer_function(divname)

{

    timer = setTimeout(function(){document.getElementById(divname).style.display='none'}, 200);

}

如果超时被清除，我必须重新聚焦到文本框，否则模糊功能将不再起作用。

感谢您的时间和帮助。:)