jQuery 更改按钮颜色 onclick

标签 jquery html css button dotnetnuke

当人们回答问题时,我会使用多个按钮。当有人点击按钮时,我如何让按钮改变颜色?我不懂 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>

我真的是编码方面的新手,所以任何形式的帮助都将不胜感激!

最佳答案

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

使用类,演示:- https://jsfiddle.net/BX6Df/

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

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

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


.red
{
    background-color:red;
}

针对您的评论更新了答案。

https://jsfiddle.net/H2Xhw/

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

关于jQuery 更改按钮颜色 onclick,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16240892/

相关文章:

javascript - 如何使用 jQuery 和 JavaScript 选择一行中的特定列?

javascript - 如何在 jquery 中使用单个取消委托(delegate)方法删除多个事件委托(delegate)

jquery - 如何使用jQuery选择表格中的某些内容

javascript - 刷新 JSP 变量而不重新加载页面

html - 我可以使用 CSS 将图像放在 <td> 标签中吗?

javascript - 根据 div 内图像的数组长度

c# - asp.net C# 如何以编程方式更改 Page_Load 上的正文背景图像

html - PIN 码输入字段

javascript - Firefox 和 Chrome 页面底部的空白

html - 滚动条目前被夹在决赛 table 列下方