javascript - 如何让 IE9 尊重 jquery hover()

Question

我有一个 div 在悬停时动画（我正在使用 jquery 的 .hover() 方法）。div 包含一个带有选择的表单。打开选择并悬停在选项上会使 IE9 将其解释为已“取消悬停”父 div，从而导致第二个悬停动画触发。你可以在这里看到它：

http://www.oliveboutiquehotelpr.com/temp/

关于如何避免这种情况的任何想法？它在所有其他主要浏览器中都能正常工作。

抱歉，这是一个 jsFiddle：http: //jsfiddle.net/jun6g/1/

Answer 1

通过添加一个反映选择焦点的变量并检查每次它想要动画，我已经解决了你的问题。此处的 Javascript 代码 ( JSFiddle )
更新
我已经解决了在您打开它后选择再次出现问题的问题，并在框关闭时通过对选择进行毛刺来关闭它。代码和链接已更新。

  var selectfocused = false;
  $('#block-block-5').mouseover(function () {
      selectfocused = false;
  });
  $('#block-block-5 select').focus(function () {
      selectfocused = true;
  }).blur(function () {
      selectfocused = false;
  });
  $('#block-block-5').hover(function () {
      if (selectfocused == false) {
          console.log(selectfocused);
          $(this).stop().animate({
              top: 0,
              opacity: 1
          });
      }
  }, function () {
      if (selectfocused == false) {
          $('#block-block-5 select').blur();
          $(this).stop().animate({
              top: -294,
              opacity: 0.6
          });
      }
  });

快乐编码！

Answer 2

此页面没有选择。无论如何，选择元素没有悬停。