Question

我正在尝试更改所选单选按钮的文本颜色。以下代码应该可以工作，但由于某种原因它不会。

CSS：

.opts {float: left; padding-left: 5px;}

HTML：

<div class="opts"><label><input class="ws" type="radio" name="ptype" value="1">A</label></div>
<div class="opts"><label><input class="ws" type="radio" name="ptype" value="2">B</label></div>
<div class="opts"><label><input class="ws" type="radio" name="ptype" value="3">C</label></div>

的jQuery

$(document).ready(function(){
  $('.ws').change(function(){
    var c = this.checked ? '#ff0000' : '#0099ff';
    this.css('color', c);
  });
});

我可以用$（'。opts'）替换“this.css”，但当然，所有文字都会改变颜色。我的问题是无法使“这个”工作。有什么帮助吗？

Answer 1

您需要更改最接近.opts的颜色，如下所示。

＆＃13;

$('.ws').change(function() {
    $('.opts').css('color', '#0099ff'); 
    $(this).closest('.opts').css('color', '#ff0000');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="opts"><label><input class="ws" type="radio" name="ptype" value="1">A</label></div>
<div class="opts"><label><input class="ws" type="radio" name="ptype" value="2">B</label></div>
<div class="opts"><label><input class="ws" type="radio" name="ptype" value="3">C</label></div>

＆＃13;

Answer 2

你需要的是一个jquery对象。哪个是$(this)，您需要使用最接近的方法遍历：

 $(this).closest('.opts').css('color', c);

如何使用jQuery更改来改变CSS

2 个答案: