不同外觀關於：在ie7和ie8中有效

Question

最近我遇到了一個讓我困惑不已的bug。例如，在這裏我把一個標籤，它有一個風格 a{font:14px}和a.active{font:18px}。在ie8中，這個工作非常完美。當我點擊標籤時，它的字體大小變成了18px，當我釋放鼠標時，它變成了14px。然後在ie7中，我點擊標籤後，其大小變成18px，當我釋放鼠標時，其字體大小沒有變化。如果我刪除頁面的其他區域，它的字體大小變回14px;我

.button:active{ 
     font-size:18px; 
} 

Answer 1

發生了什麼事情是IE7正在考慮錨仍然「活躍」，因爲它還沒有失去焦點。這實際上是有意義的（也許不是）。不過，其他瀏覽器在釋放鼠標按鈕時會立即認爲它處於不活動狀態，我們通常認爲這是理所當然的。

如果你真的想辦理一個鏈接mousedown和mouseup事件，我想你會需要JS來對付它：

平原JS解決方案

var a = document.getElementById("myLink"); 
a.onmousedown=function(){ 
    this.setAttribute("class", "active"); 
}; 

a.onmouseup=function(){ 
    this.setAttribute("class", ""); 
}; 

jQuery的解決方案

var $a=$('#myLink'); 
$a.mousedown(function(){ 
    $(this).addClass('active'); 
    // this is actually much more scalable, if you don't mind using jQuery 
}); 

$a.mouseup(function(){ 
    $(this).removeClass('active'); // and this as well 
});