-1

私はこのhtmlを持っています

<table border="1">
    <tr>
        <td>
            <input type="checkbox">
        </td>
        <td>
            Hello
        </td>
        <td>
            my friend!
        </td>
    </tr>
    <tr>
        <td>
            <input type="checkbox">
        </td>
        <td>
            ...
        </td>
        <td>
            ...
        </td>
    </tr>
    ...
</table>

<tr>チェックボックスがアクティブになっているときにbgcolorを変更したい場合は、どうすればよいですか？onclick()多分何かをする必要があると思います。

編集：私が必要としているのは、チェックボックスが彼の現在の行のみを変更する必要があるということです。

4

2 に答える 2

3

可能なアプローチの1つ：

document.getElementById('table').onclick = function(e) {
    var e = e || event,
        el = e.srcElement || e.target;
    if (el.tagName == 'INPUT') {
        el.parentNode.parentNode.className = el.checked ? 'active' : '';
    }
};

http://jsfiddle.net/TQbpH/2/

この例では、イベントはそれをリッスンする親テーブルにバブルされ、必要に応じてディスパッチされます。

于 2013-01-22T09:07:54.743 に答える
1

http://jsfiddle.net/L6xsB/

$(function () {
    $('tr').on('click', 'input:checkbox', function () {
        $(this).parents('tr').toggleClass('active');
    });
});

CSS：

tr.active {
    background-color: #FFC;
}
于 2013-01-22T09:03:09.690 に答える