未选中时如何触发单选按钮的 OnChange 事件答案

【问题标题】：How to trigger OnChange Event of Radio Button when its UnChecked未选中时如何触发单选按钮的 OnChange 事件
【发布时间】：2014-04-22 09:19:07
【问题描述】：

当然，我有一个带有行和列的 HTML 表格。每行都有单选按钮，每一行都是一组单选按钮，这意味着我只能从所有列中选择该行中的一个单选按钮。我正在尝试在选择表中的单选按钮单元格时设置 CSS，这很好，但是当我移动到同一行中的另一个单选按钮时，作为单选按钮组，前一个单选按钮被取消选择，但 CSS保留在那里，因为在组中选择另一个收音机不会触发自动取消选择的收音机的 OnChange 事件。

有没有办法在取消选择收音机时触发 onChange 事件？

【问题讨论】：

这对你有用吗？ stackoverflow.com/questions/11173685/…
也许这是定义单选按钮的精确上下文的问题，例如'tr'？如果您发布您正在使用的代码会有所帮助。
我正在动态创建行和列，并在 TD 中创建单选按钮，并将 OnChange 事件与每个单选按钮绑定。

标签： radio-button onchange unchecked

【解决方案1】：

这个怎么样：http://jsfiddle.net/2Z8Nt/14/

$(function () {
    // Create table and radios
    for (var tri = 0; tri < 3; tri++) {
        var $tr = $('<tr>').appendTo('table');
        var $td = $('<td>').appendTo($tr);
        for (var rai = 0; rai < 3; rai++) {
            var $sp = $('<span class="radio-holder">');
            var $rd = $('<input type="radio" name="rad-' + tri + '" class="rad" value="val-' + rai + '"/>').appendTo($sp);
            $sp.append('Radio ' + tri  + '' + rai);
            $td.append($sp);
            $tr.append($td);
        }
    }

    // Record to keep track of radio selection
    var selrad = {};

    // Handler
    $('input.rad').on('deselect', function () {
        $(this).parents('.radio-holder').addClass('just-deselected')
    }).each(function () {
        $(this).on('click', function () {
            var nm = $(this).attr('name');
            $('input[name="' + nm + '"').parents('.radio-holder').removeClass('just-deselected');

            if (selrad[nm]) {
                selrad[nm].trigger('deselect');
            }

            selrad[nm] = $(this);
        })
    });
})

CSS

.radio-holder {
    border: 1px solid silver; 
    margin: 3px;
    padding: 3px;
}
.radio-holder.just-deselected {
    border: 1px solid red; 
}

【讨论】：