jquery - 所选单选按钮的背景颜色不变

标签 jquery css html radio-button

<分区>

我不打算使用字段集,而是使用带有单选按钮的跨度。对 html 和 jquery 很陌生。选中时,我需要更改单选按钮的选定颜色。我是否使用了错误的元素来显示单选按钮?这是代码:

<div id="sidebar">
  <span style="font-weight: bold;">Filter</span><br>
  <input backgroundColor="red" type="radio" name="filter" value="schedule">Schedule<br>
  <input type="radio" name="filter" value="risk">Risk<br>
  <input type="radio" name="filter" value="opm">OPM<br>
  <input type="radio" name="filter" value="location">Location<br>
  <input background-color="red" type="radio" name="filter" value="all" checked>All<br>
</div>

最佳答案

您需要更新 HTML 并添加 CSS 才能实现此目的:

HTML:

<div id="sidebar">
    <span style="font-weight: bold;">Filter</span>
    <br>
    <input type="radio" name="filter" value="schedule"><span>Schedule</span>
    <br>
    <input type="radio" name="filter" value="risk"><span>Risk</span>
    <br>
    <input type="radio" name="filter" value="opm"> <span>OPM</span>
    <br>
    <input type="radio" name="filter" value="location"> <span>Location</span>
    <br>
    <input type="radio" name="filter" value="all" checked><span>All</span>
    <br>
</div>

CSS:

input:checked + span {
    color: red;
}

演示:http://jsfiddle.net/lotusgodkk/GCu2D/1023/

引用:https://developer.mozilla.org/en/docs/Web/CSS/Adjacent_sibling_selectors

关于jquery - 所选单选按钮的背景颜色不变,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34739405/

上一篇:css - 并排定位表单元素

下一篇:jquery - 为什么 div 在部分 View 中回发后重复使用相同的 id 和类,MVC

相关文章:

jquery - 根据其文本而不是值选择下拉选项

javascript - 为什么在滚动元素中使用 offset().top 和 scrollTop() 时我的尺寸没有按预期返回?

javascript - 使文本重复地从一列流到另一列

jquery - plax.js 仅在重新加载时有效

javascript - jquery 基于变量启用/禁用表单字段部分

javascript - 从 div 到 div 的 Angular 移动指令

html - 将所有 Bootstrap 内容放入可视区域

css - 固定位置在某些浏览器中无法按预期工作

c# - Gridview ASP.NET 锁定第一列和第一行

c# - 在使用 bot 框架时,如何设计 skype for business html 消息的样式?