IE9不删除：hover样式的DOM变化(IE9 not removing :hover style

我试图做的是有一个按钮：在弹出框中悬停状态，当按钮，你一个，我删除从DOM盒子，将其保存为未来的共同作用。 问题是，当我将其安装在IE9还没有清除的DOM：悬停状态，直到你下一次鼠标悬停它再出来。

显然，这是不存在任何其他浏览器，但重复性这里： http://jsfiddle.net/5dXSp/

我不能找到清除CSS的手动方式：悬停状态，我真的不希望每次都重建菜单因为这个原因。 有什么想法吗？

Answer 1:

试着控制与类和jQuery悬停。 这似乎为我工作： http://jsfiddle.net/5dXSp/25/

CSS：

.box{
    height:200px;
    margin:10px 0;
}    
.button{
    display:block;
    width:200px;
    height:20px;  
    background:#ccc;      
}
.hover {
  background-color: #000;
 }​

jQuery的：

$(".button").hover(
  function () {
   $(this).addClass("hover");
  }, 
  function () {
    $(this).removeClass("hover");
  }
);

$(".button").click(function(ev){
    ev.preventDefault();
    $(ev.target).appendTo($(".catch"));
    $(this).removeClass("hover");
});

Answer 2:

还有就是要解决这个问题的另一种方式。 您可以从DOM分离之前隐藏的元素，但在不同的事件处理 。 类似的东西：

// HTML structure: <div id="aaa"> <a id="bbb"> Text </a> </div>

var bbb = document.getElementById('bbb');
var container = document.getElementById('aaa');

bbb.attachEvent("onclick", function() {
    bbb.style.display = "none";

    window.setTimeout(function() {
        container.removeChild(bbb);
        bbb.style.display = "";

        // Some time later

        window.setTimeout(function() {
            container.appendChild(bbb);
        }, 2000);
    }, 1);
});

bbb.style.visibility =“隐藏”工作太。

Answer 3:

使用jQuery你可以做丑陋的东西，如：

if($.browser.msie)
   $('el').html($(el).html());

以取消和附加元素

文章来源: IE9 not removing :hover style on DOM change