没有选择器的 jquery siblings() 不工作

Question

简单表格:

    <table class="schedules">
        <th colspan="2">Saved Schedules</th>
        <tr>
            <td>Winter 2011 </td>           
        </tr>
        <tr>
            <td>Winter 2011 (2) </td>           
        </tr>
        <tr>
            <td>May Term 2011 </td>         
        </tr>
        <tr>
            <td>Fall Term 2011</td>         
        </tr>       
    </table>

J查询:

    <script type="text/javascript">
        $(document).ready(function(){
            $(".schedules td").click(function(){
                $(this).css("background-color","blue")
                $(this).siblings().css("background-color","white");         
            });
        });     
    </script>

这应该将选定的单元格切换为背景色:蓝色，并将兄弟单元格切换为背景色:白色，但是当我单击每个单元格时，只会更改为背景色:蓝色，而其他单元格则根本没有改变。

Answer 1

你的 <td>是堂 sibling ，不是 sibling 。 td 的 parent (<tr> 的)是 sibling 。您可以像这样修改 jquery...

http://jsfiddle.net/superuntitled/fb4g7/

    $(document).ready(function(){
        $(".schedules tr").click(function(){
            $(this).find('td').css("background-color","blue")
            $(this).siblings().find('td').css("background-color","white");         
        });
    });