jquery - 如果用户单击具有 css cssselected 的 tr，如何移除焦点？

Question

在我的 html 表中，我有两行，第一行没有 css，但第二行有 cssselected 到 tr。如果用户单击带有 cssselected 的 tr 或 td，我必须移除焦点。

 <table id="myTable">           
            <tr>
                <td>
                    cell4
                </td>
                <td>
                    cell5
                </td>
                <td>
                    cell6
                </td>
            </tr>
            <tr class="cssselected">
                <td class="cssselected">
                    cell 12
                </td>
                <td class="cssselected">
                    cell8
                </td>
                <td class="cssselected" rowspan="2">
                    cell8
                </td>
            </tr>
            <tr class="cssselected">
                <td class="cssselected">
                    cell9
                </td>
                <td class="cssselected">
                    cell10
                </td>
            </tr>
        </table>

Answer 1

如果删除焦点意味着cssselected从该行中删除（我这样说是因为焦点是您与输入标签一起使用的术语）：

$('tr').click(function() {
    // If the clicked tr has the class cssselected
    if($(this).hasClass('cssselected')){
        // Remove the class cssselected 
        // from all the descendant td and from the clicked tr
        $('td', this).andSelf().removeClass('cssselected');
    }
});

在这里摆弄http://jsfiddle.net/97HVf/

Answer 2

这是 JQuery 解决方案：-

$(document).ready(function(){

    $('.cssselected').click(function(){
        $(this).removeClass('cssselected');
    });
});