拨动开关变灰 div

Question

我正在尝试根据切换是否处于活动状态（选中）将 div 变灰。尽管 div 没有淡出

，但当我 select 切换时，js 似乎正在触发

超薄模板

- @products.each do |product|
    .mdl-cell.mdl-cell--4-col.item-border.mdl-shadow--2dp
      .mdl-cell.mdl-cell--1-col.mdl-cell--10-offset
        label.mdl-switch.mdl-js-switch.mdl-js-ripple-effect for=product.name
          input.mdl-switch__input checked="checked" type="checkbox" id=product.name /
          span.mdl-switch__label
      .mdl-cell.mdl-cell--12-col
        h4.teal-heading= product.name
      - @properties.each do |property|
        .mdl-cell.mdl-cell--12-col
          .mdl-textfield.mdl-js-textfield.mdl-textfield--floating-label.mdl-cell.mdl-cell--12-col
            input.mdl-textfield__input type="text" id=property.id
            label.mdl-textfield__label for=property.id
              = "#{property.name } Price"

Jquery

$('.mdl-switch__input').click(function(){ $(this).parent('.mdl-cell--4-col').$(this).fadeTo(500, 0.2); });

Answer 1

我相信这应该可以解决问题。

$('.mdl-switch__input').click(function() {
    $(this).closest('.mdl-cell--4-col').fadeTo(500, 0.2);
});

拨动开关变灰 div

Grey out div from toggle switch

jquery

ruby-on-rails

slim-lang

material-design-lite