用于自制单选按钮的javascript无效

Question

我有这个JS用于我自己的单选按钮;但它似乎没有起作用;控制台在第14行记录：Uncaught SyntaxError：Unexpected token}。

这是我使用的代码：

$(document).ready(function(){
    $('.choise').click(function(){

        $(this).css({"background":"#58D998"});

        });
    if ( $('.choise').css({"background":"#58D998"}) ) 
            {

            $('.choise').click(function()
                {
                $(this).css({"background":"rgba(0, 0, 0, 0.7)"});
                }
            }
        );

);

我希望此代码的工作方式如下：首次在按钮上单击时，将背景颜色设为X.第二次按下时，将其更改为颜色Y.

Answer 1

您的第二个}处理程序中有一个click太多。

话虽这么说，你的代码很难看而且非常错误。它不会切换。

你为什么不这样做？

<label class="choice"><input type="radio" /><span>Click here!</span></label>
<label class="choice"><input type="radio" /><span>Or here!</span></label>

这个CSS：

label.choice>input[type=radio] {display:none}
label.choice>input[type=radio]:checked~span {background:#58D998}

Answer 2

DEMO

$(document).ready(function () {
    $('.choise').click(function () {
        $(this).css({
            "background": "#58D998"
        });

        if ($('.choise').css({
            "background": "#58D998"
        })) {
            $('.choise').click(function () {
                $(this).css({
                    "background": "rgba(0, 0, 0, 0.7)"
                });
            });
        }
    });
});

Answer 3

简单的回答：

更详细：

你是近距离大括号在错误的地方。您的代码应为：

$(document).ready(function(){
    $('.choise').click(function(){

        $(this).css({"background":"#58D998"});

        });
    if ( $('.choise').css({"background":"#58D998"}) ) 
        {

            $('.choise').click(function()
                {
                $(this).css({"background":"rgba(0, 0, 0, 0.7)"});
                }
            );
        }


);

正如其他人所指出的那样，这可能不是解决问题的最佳方式。