鼠标不再悬停后 CSS 悬停样式仍然保留

Question

在 Safari 版本 7.0.1 和 IE8 中会发生以下情况。

重现问题的步骤： http: //goo.gl/lP3Ky1

问题：关闭弹出菜单后，该行的悬停状态仍然存在，并且无论鼠标位于何处，它都不会消失，直到您再次将鼠标悬停在其上。

预期的行为是什么？关闭弹出菜单后，该行的悬停状态应该消失。

有人知道 Safari 7.0.1 版和 IE8 的修复程序吗？我可以使用一些手动方式来“取消触发”CSS 悬停状态。

Answer 1

这是一个需要解决的有趣问题。虽然这个解决方案有点老套，但它确实有效。将 HTML 设置为“boo”后，我们克隆整行，插入它，然后删除旧的行：

$(function() {
  $("table").on("click", "td", function() {
    $("#menu")
        .clone()
        .one("click", function() {
              var $td = $(this).closest("td"),
                  $tr = $td.parent();

              $td.html("boo");
              $tr.clone(/* true */).insertAfter($tr);
              $tr.remove();
              return false;
        })
        .appendTo(this)
        .show();
  });
});

http://jsfiddle.net/ryanwheale/3BUaT/26/