CSS Toggle 选项卡使用 Javascript 动态更改

Question

我正在尝试使用 JavaScript 更改比率标签按钮的背景颜色，以便在用户单击特定按钮后动态更改它。

如果您查看下面的链接，一旦您单击蓝色或红色框，黄色条和文本会发生变化，但我还希望 [type=radio]:checked ~ label 按钮发生变化。

http://jsfiddle.net/thepaddyman/XWjJm/

$("document").ready(function(){

        $(".red").click(function(){
        $(".content").css("border-top-color","red");   
        $(".content").css("color","red"); }); }); 



        $("document").ready(function(){
        $(".blue").click(function(){
        $(".content").css("border-top-color","blue");     
        $(".content").css("color","blue"); 

}); });

谢谢一百万

帕特里克

Answer 1

这里正在工作demo

您不需要像 hjpotter92 建议的那样嵌套 $(document).ready()

$(document).ready(function(){
    $(".red,#tab-1").click(function () {
        $(".content").css("border-top-color", "red");
        $(".content").css("color", "red");
    });
    $(".blue,#tab-2").click(function () {
        $(".content").css("border-top-color", "blue");
        $(".content").css("color", "blue");
    });
});