addClass不工作？

爲什麼不addClass工作？點擊與類step div div背景和字體顏色應該改變，但沒有發生。addClass不工作？

<html> 
    <head><style type="text/css"> 
    .currentstep { 
    background-color:#eeb345; padding:5px; color:#000000; font-size:14px; font-family:Arial; 
    } 
    #stepcontainer { 
    overflow:hidden; width:100%; 
    } 
    .step { 
    float:right; width:auto; margin-right:2px; background-color:#59758d; padding:5px; color:#FFFFFF; font-size:14px; font-family:Arial; cursor:pointer; 
    } 
    </style> 
    <script type="text/javascript"> 
$(function(){ 

    $('.step').live('click',function() { 

    $(this).addClass('currentstep'); 
    $(this).siblings('.step').removeClass('currentstep'); 

    }); 
}); 
    </script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
    </head> 
    <body> 
    <div id='stepcontainer'><div id='reset'><a>Reset</a></div> 
    <div class='step'>Step 3</div><div class='step'>Step 2</div><div class='step'>Step 1</div></div> 
    </body></html>

來源

2011-11-30 user892134

只是把你的腳本src放在jQuery代碼上面。 – sumi

class * currenttep *在class * step *之前指定，所以* step *的規則優先。更改樣式表中的順序（這就是**級聯**樣式表應該如何工作）。 – RobG

你申請都.step和.currentstep到同一div（我假設你不想從DIV刪除.step）。從.step開始的background-color是第一個，所以這是堅持的顏色。

嘗試改變CSS定義爲.currentstep到：

.currentstep 
{ 
    background-color:#eeb345 !important; 
    padding:5px; 
    color:#000000; 
    font-size:14px; 
    font-family:Arial; 
}

這是否工作正常：http://jsfiddle.net/tomtheman5/j6f6w/

來源

2011-11-30 06:49:21

這是在樣式表中指定類的順序 - 後面的規則優先於以前的規則。 * step *放置在樣式表中的* currentStep *之後，所以它的背景顏色優先，無論這些類添加到元素的順序或它們在元素類值中的位置如何。 – RobG

在這裏工作的解決方案。

http://jsfiddle.net/Q6ttQ/15/

來源

2011-11-30 06:53:26

addClass不工作？

回答

相關問題