0
<div id="lifecycleStage">
<div id="private2">
    <input type="radio" name="lifecyclePrivate" value="preliminary"         id="preliminary"/>      <label for="preliminary">Preliminary</label>
    <input type="radio" name="lifecyclePrivate" value="prelist"             id="prelist"/>          <label for="prelist">Prelist</label>            
    <input type="radio" name="lifecyclePrivate" value="retired"             id="retired"/>          <label for="retired">Retired</label> <br>           
    <input type="radio" name="lifecyclePrivate" value="internal product"    id="internalProduct"/>  <label for="internalProduct">Internal Product</label>   
    <input type="radio" name="lifecyclePrivate" value="reference nop"       id="referenceNOP"/>     <label for="referenceNOP">Reference NOP</label>     
</div>
<div id="public">
    <input type="radio" name="lifecyclePublic" value="listed"               id="listed"/>           <label for="listed">Listed  ................</label>             
    <input type="radio" name="lifecyclePublic" value="approaching op"       id="approachingOP"/>    <label for="approachingOP">Approaching OP</label>      
    <input type="radio" name="lifecyclePublic" value="no longer available"  id="noLongerAvailable"/><label for="noLongerAvailable">No Longer Available</label> 
</div>

選択したラベルの背景を別の「ユニークな」色に変更したいと思います。たとえば、プレリストを選択すると背景が青色になりますが、リタイアを選択すると背景が黒色になります。

ヒントやコツ、大歓迎です!

4

2 に答える 2

2
$('label').on('click',function() {
    $('label').removeClass('active');
    $(this).addClass('active');
});

デモ: http: //jsfiddle.net/hpU6k/

于 2013-03-04T20:30:31.473 に答える
2

なぜjQueryを使用するのですか?CSSを使用するだけです。

label {
    background-color: #000;
}

input[type=radio]:checked + label {
    background-color: #00f;
}

JSフィドルデモ

于 2013-03-04T20:34:19.363 に答える