变化背景jQuery的

<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>

变化背景jQuery的

我想是到所选标签的背景更改为不同的“独一无二”的色彩。例如，当选择预选列表时，它具有蓝色背景，但选择退休时，它具有黑色背景。

任何提示和技巧，非常感谢！

来源

2013-03-04 HelloWorld

除非颜色是随机的，否则这可以用纯CSS完成。 – cimmanon 2013-03-04 20:30:11

为什么使用jQuery？只需使用CSS：

label { 
    background-color: #000; 
} 

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

JS Fiddle demo。

来源

2013-03-04 20:34:19

这是一个免费的小提琴：http://jsfiddle.net/GWZwd/ – cimmanon 2013-03-04 20:34:43

@cimmanon：谢谢，但我已经创建了我自己的;只是在您发表评论时对其进行编辑。 =） – 2013-03-04 20:36:13

好吧，这是偷偷摸摸的你，因为当你为我发布我的答案时，我正在完成我的小提琴！ – cimmanon 2013-03-04 20:36:54

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

演示：http://jsfiddle.net/hpU6k/

来源

2013-03-04 20:30:31

变化背景jQuery的

回答

相关问题