html select 监听事件无效,关闭HTML select元素时是否会触发DOM事件？

不幸的是，没有知道选择框是何时关闭或打开的标准事件，因此您的代码将变得很笨拙，并且可以容纳不同的浏览器。就是说，我认为这是可以做到的，并且使用该mouseup事件，我已经在Firefox中为您工作了：

http://jsfiddle.net/FpfnM/50/

在Firefox(我假设使用的是Chrome)中，您需要非常仔细地跟踪选择状态。当escape按键或blur事件发生时，您需要更新状态以将其标识为已关闭。我尚未在演示中实现该功能，您可以看到如果单击逃逸而不是单击选择，会发生什么情况。

在Safari中，事情变得容易得多，其中mousedown选择项上的事件表示打开选择项，而选择项的任何关闭均由click事件表示。

如果找到没有触发这些事件的浏览器，则可以尝试另一种技巧。由于select和textarea之类的表单小部件通常是由OS而不是在浏览器内部呈现的，因此您有可能与它们进行交互，并且某些消息可能不会进入浏览器的事件处理程序。如果在选择框打开时将覆盖屏幕的透明文本区域放置在较低的z索引处，则可以使用它来跟踪关闭点击。它可能能够捕获浏览器DOM元素可能丢失的事件。

更新： Chrome在选择项打开时会在其上按下鼠标，在选择选择项处于打开状态时单击该页面时，在文档上会在鼠标上单击。这是适用于Chrome的版本：

http://jsfiddle.net/FpfnM/51/

同样，您需要进行一些浏览器检测以处理每个浏览器中的正确行为。尤其要注意的是，当您再次单击“选择”以将其关闭时，不会触发任何事件。但是，您可以检测到页面点击。

快速摘要：

Chrome/Safari: select.mousedown on open, document.mouseup on close

Firefox: select.click on open, document.mouseup on close

IE8/IE7: select.click on open, document.mouseup on close

对于其他事件，有很多边缘情况会表示关闭(退出键，模糊等)，但这是处理用户单击选择框然后单击进入文档区域的最小情况。

希望这可以帮助！