jquery更改按钮颜色onclick

Question

当人们回答问题时,我会使用多个按钮.当人们点击按钮时,如何让按钮改变颜色？我不知道jquery,我被告知这是最好用的

这是我对html部分的代码:

<div style="text-align: center;"><span style="line-height: 18px; font-family: Arial, Helvetica, sans-serif; font-size: 24px;">In the past three months, how often have you used marijuana?<br />
<p><input type="submit" value=" Never " name="btnsubmit" id="answer" style="width: 200px;" /></p>
<p><input type="submit" value=" Once or Twice " name="btnsubmit" id="answer" style="width: 200px;" /></p>
<p><input type="submit" value=" Monthly " name="btnsubmit" id="answer" style="width: 200px;" /></p>
<p><input type="submit" value=" Daily or Almost Daily " name="btnsubmit" id="answer" style="width: 200px;" /></p>
</span></div>
<div>
<p style="text-align: right;"><a onclick="window.open(this.href,'_parent');return false;" href="/mobile/Static2.aspx"><input type="submit" value=" Next " name="btnsubmit" style="width: 100px;" /></a></p>
</div>

我真的很擅长编码,所以任何形式的帮助都将受到赞赏!

Answer 1

$('input[type="submit"]').click(function(){
$(this).css('color','red');
});

使用课程,演示: - http://jsfiddle.net/BX6Df/

   $('input[type="submit"]').click(function(){
          $(this).addClass('red');
});

如果你想在每次点击时切换颜色,你可以试试这个: - http://jsfiddle.net/SMNks/

$('input[type="submit"]').click(function(){
  $(this).toggleClass('red');
});


.red
{
    background-color:red;
}

更新了您的评论的答案.

http://jsfiddle.net/H2Xhw/

$('input[type="submit"]').click(function(){
    $('input[type="submit"].red').removeClass('red')
        $(this).addClass('red');
});

Answer 2

我只想创建一个单独的CSS类:

.ButtonClicked {
    background-color:red;
}

然后在点击时添加课程:

$('#ButtonId').on('click',function(){
    !$(this).hasClass('ButtonClicked') ? addClass('ButtonClicked') : '';
});

这应该做你正在寻找的东西,由这个jsFiddle显示.如果你对这样的逻辑感到好奇,它就?叫做三元(或条件)运算符,它只是一个简单的方法来做简单的if逻辑来检查是否已经添加了类.

您还可以通过切换类来创建具有"开/关"开关感觉的功能:

$('#ButtonId').on('click',function(){
    $(this).toggleClass('ButtonClicked');
});

由这个jsFiddle显示.只是值得深思.