0

我正在创建一个页面来管理电子邮件订阅，但我无法确定从所有每个组中取消订阅选项。

问题

我的问题是我不知道如何让Un-subscribe from all选项激活 Un-subscribe 列中与该特定组对应的单选按钮。

在检查取消订阅列中的单选按钮时，我还需要向.selected它们的标签添加一个类，以便为它们设置样式，以直观地帮助传达该选项已被选中。

Also note that within a specific group, when a Subscribe option is checked, the Un-subscribe from all checkbox of that specific group becomes unchecked and the class .selectedis removed.

我知道这有点令人困惑（或很多），所以我创建了一个演示。

正如您将在 JS 注释中看到的那样，我可以选择单选按钮，但所有组的所有单选按钮都会被选中，而不是特定的单选按钮组。

我也尝试过使用.parent(), .parents(),.closest()方法，但我只是无法使其工作。

非常感谢您对此的任何帮助。

提前致谢。

4

2 回答 2

1

http://jsfiddle.net/8MHHa/1/

$(".unsubs-chkbx-group").click(function() {
    $(this).parents('table').first().find('.opt-out input:radio').attr('checked', true);
    $(this).parents('table').first().find('.opt-out label').addClass('active');
    //$('.opt-out input:radio').attr('checked', true);
    //$('.opt-out label').addClass('active');    
});
于 2012-08-13T19:51:04.997 回答
1

您可以这样做：

$(".unsubs-chkbx-group").change(function() {
    var $table = $(this).closest('tbody');

    // uncheck all
    $('tr:not(.group) input', $table).prop('checked', false);
    $('label', $table).removeClass('selected');

    if(this.checked) {
        var $elements = $('.opt-out', $table);
        $('label', $elements).addClass('selected');
        $('input', $elements).prop('checked', true);
    }
});

$('tbody input[type=radio]').change(function() {
    var $element = $(this);
    var $row = $element.closest('tr');
    $('label', $row).removeClass('selected');

    $element.parent().addClass('selected');
});

​</p>

演示

于 2012-08-13T20:09:10.700 回答