刪除a：懸停使用javascript（不使用jquery ...不要問）

Question

我認爲這將是非常簡單的....基本上，它是一個5星級評分系統。例如，當用戶點擊三顆星時，我想將這三顆星定位在他們所在的位置。我一直試圖簡單地刪除href的懸停，以便它保持原來的狀態...也許這不是正確的方法。我用盡了所有我能想到的東西......順便說一句，這是直的JavaScript，而不是jQuery或任何東西。這是瘋了，我知道，但所有的JS的是直寫....

我有這個類：

.star-rating li a{ 
    display:block; 
    width:25px; 
    height: 25px; 
    text-decoration: none; 
    text-indent: -9000px; 
    z-index: 20; 
    position: absolute; 
    padding: 0px; 
} 
.star-rating li a:hover{ 
    background: url(images/alt_star.png) left bottom; 
    z-index: 2; 
    left: 0px; 
} 
.star-rating a:focus, 
.star-rating a:active{ 
    border:0; 
    -moz-outline-style: none; 
      outline: none; 
} 
.star-rating a.one-star{ 
    left: 0px; 
} 
.star-rating a.one-star:hover{ 
    width:25px; 
} 

和驗證碼：

<ul class='star-rating'> 
<li><a href="#" onclick="javascript: vote(<?=$id;?>, 1); disableStars(); return false;" 
      title='1 star out of 5' id="1s" class='one-star'>1</a></li> 

Answer 1

我建議向包含它們的元素添加一個類，然後在不想讓懸停點再次影響它時移除類。

.not-selected.star-rating a.one-star:hover{ 
    width:25px; 
} 

有了一些JavaScript，取出not-selected類，因此禁用適用於懸停效果的規則。

Answer 2

如果要從定位標記中刪除:hover行爲，請添加另一個沒有a:hover樣式的類。