1

リンクのリスト。クリックすると色が変わります。つまり、アクティブなリンクを強調表示します...このページは更新されていないため、cssを使用できません。現在のリンクを強調したい。

HTML

<table border="0">
    <tr style=" width: 100px;">
        <td>
            <div class="overMe">
                <a href="javascript:void(0);" class="leftList">link 1</a>
            </div>
        </td>
    </tr>
    <tr style=" width: 100px;">
        <td>
            <div class="overMe">
                <a href="javascript:void(0);" class="leftList">link 2</a>
            </div>
        </td>
    </tr>
    <tr style=" width: 100px;">
        <td>
            <div class="overMe">
                <a href="javascript:void(0);" class="leftList">link 3</a>
            </div>
        </td>
    </tr> </table>

CSS

a {
    color: darkgreen;   
}


.selected {
     color: red;   
}

jQueryコード

$(document).ready(function(){
    $('.overMe a').click(function(){
        $(this).addClass('selected');
        $('.overMe a').siblings().removeClass('selected');
    });
})

例: http: //jsfiddle.net/TL9rh/

4

2 に答える 2

3

使用.not(this)

$('.overMe a').not(this).removeClass('selected');

例: http: //jsfiddle.net/Curt/TL9rh/65/

于 2012-06-27T11:33:32.570 に答える
3

物事を単純化することができます

$(document).ready(function(){
    $('.overMe a').click(function(){
        $('.overMe a').removeClass('selected');
        $(this).addClass('selected');
    });
});
于 2012-06-27T11:37:54.600 に答える