如何：在mouseOver/mouseOut上添加/刪除類 - jQuery .hover？

Question

展望改變一個框的邊框顏色..

..when用戶將鼠標移動/出..

這裏的企圖代碼..需要工作！

JQuery的：

<script> 
$("result").hover(
    function() { 
    $(this).addClass("result_hover"); 
    }, 
    function() { 
    $(this).removeClass("result_hover"); 
    } 
); 
</script> 

CSS3：

<style> 
    .result { 
    height: 72px; 
    width: 100%; 
    border: 1px solid #000; 
    } 
    .result_hover { 
    border: 1px solid #fff; 
    } 
</style> 

HTML5：

<div class="result"> 
    <div class="item"> 
    <div id="item1"> 
     <i class="icon"></i>&nbsp;## 
    </div> 
    </div> 
<div> 

感謝您尋找

Answer 1

你忘了的結果C的class selector的dot姑娘。

Live Demo

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

您可以在hover事件中使用toggleClass

Live Demo

$(".result").hover(function() { 
    $(this).toggleClass("result_hover"); 
}); 

Answer 2

你可以只使用：{進出回調函數}

$(".result").hover(function() { 
    $(this).toggleClass("result_hover"); 
}); 

對於你的榜樣，更好的將是使用CSS僞類:hover：{沒有JS/jQuery的需要}

.result { 
    height: 72px; 
    width: 100%; 
    border: 1px solid #000; 
    } 
    .result:hover { 
    background-color: #000; 
    } 

Answer 3

你缺少的選擇點，並且可以使用toggleClass方法jQuery的：

$(".result").hover(
    function() { 
    $(this).toggleClass("result_hover")  
    } 
); 

Answer 4

你的選擇缺少.，雖然你說你想改變border-color - 你添加和刪除一個類，設置background-color