JQuery突出显示行与复选框单击

Question

$(document).ready(function(){
    $(".txtDate").datepicker({ showOn: "both", 
        buttonImage: "library/ui/datepicker/img/calendar2.gif", dateFormat: "yy/mm/dd", buttonImageOnly: true });

    //added this checkbox click for something I given earlier

    $("#Table input").click(function() { 
        if ($(this).attr("checked") == true)
        {
            $(this).parent().parent().addClass("highlight");  
        } 
        else
        {   
            $(this).parent().parent().removeClass("highlight");
        }
    });
});

我有一个复选框控件,我在后面的代码中动态添加每一行

for( int i=0; i< data.count;i++){   
    HtmlTableCell CheckCell = new HtmlTableCell();
    CheckBox Check = new CheckBox(); 

    CheckCell.Controls.Add(Check);

    row.Cells.Add(CheckCell);
    Table.Rows.Add(row);
}

带有标记的表id在这里:

<table id="Table"  runat="server" width="100%" cellspacing="5" border="1"> 
    <colgroup width="3%"></colgroup>
    <colgroup width="15%"></colgroup>
    <colgroup width="20%"></colgroup>
    <colgroup width="15%"></colgroup>
    <colgroup width="47%"></colgroup>
    <thead>
        <tr> 
            <th id="CheckBox" runat="server"><input type="checkbox" id="CheckBox1" name="CheckBox" runat="server" /></th>
            <th id="Type" runat="server"></th>
            <th id="Category" runat="server"></th>  
            <th id="DateTime" runat="server"></th>  
            <th id="Description" runat="server"></th>
        </tr>
    </thead> 
    <tbody>
    </tbody>
</table>

Answer 1

您的JQuery代码没有任何问题 - 尽管如果您使用toggleClass它会更清晰:

 $('#Table INPUT').click(function() {
     $(this).parent().parent().toggleClass('highlight');
 });

我想你的id是错的 - 或者你在JQuery的片段运行之前遇到了另一个JavaScript错误.