如果选中更改bg颜色,则jquery问题

时间:2014-05-27 15:12:10

标签: javascript jquery html

你好我做了一个脚本,当选择无线电时应该改变背景。它可以工作但是当选择另一个无线电时,前一个仍然保留所选颜色。它适用于复选框,但不适用于收音机。

<script type="text/javascript">
$(".table").change(function(){
  var c = this.checked ? "#18b9e7" : "#b6bf34";
  $(this).parent().css("background-color", c);
});
</script>

这是jsfiddle

5 个答案:

答案 0 :(得分:3)

我认为你需要这个:

你的小提琴包含复选框而不是单选按钮,确保它的收音机或复选框。

$('.table').change(function(){
  var c = this.checked ? '#00B0EA' : '#B6BF34';
  $(this).parent().css('background-color', '#00B0EA').siblings().css('background-color', '');
});

Demo

答案 1 :(得分:0)

添加

$(ALL RADIOS SELECTOR).css('background-color', DISABLED_COLOR)
例如

之前的

$(".table").change(function() {

  var $this = $(this),
      c     = this.checked ? "#18b9e7" : "#b6bf34"

  $this.find('input[type="checkbox"]').parent().css('background-color', "#b6bf34");

  $this.parent().css("background-color", c);

});

如有必要,将复选框更改为收音机

答案 2 :(得分:0)

这更简单:

$(".table").change(function(){

  $(".table").parent()                     //all the inputs
      .css("background-color", "#b6bf34"); //to be green

  $("input[name=masa]:checked").parent()   //only the checked
      .css("background-color", "#00B0EA"); //to be blue
});

http://jsfiddle.net/UvP3f/12/

答案 3 :(得分:0)

我会像这样处理它:

http://jsfiddle.net/UvP3f/10/

var $labels = $(".m1");
$('.table').change(function(){
  var c = this.checked ? '#00B0EA' : '#B6BF34';
  $labels.removeAttr("style");
  $(this).parent().css('background-color', c);
});

将引用缓存到$labels处理程序之外的change

答案 4 :(得分:0)

单选按钮的问题在于,一旦您更改一个值的值会自动取消选择其他值但只是在单击的控件上触发更改事件,您需要检查所有控件并在每次更改事件时应用相同的逻辑被触发:

$('.table').change(function(){
    $('.table').each(function(){
        var c = this.checked ? '#00B0EA' : '#B6BF34';
          $(this).parent().css('background-color', c);
    });
});