Question

我试图根据切换是否处于活动状态（已选中）而使div变灰。当我选择切换时，js似乎在触发，虽然div没有被淡出

超薄模板

- @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);
});

来自拨动开关的灰色输出

1 个答案: