1

複数のリンクにClassを追加する方法はありますか？同じリンクのセットを含む2つの異なるdivがあります。リンクをクリックすると、他のdivのセット内の「同等の」リンクに同じクラスが適用されます。

<style>
.one{margin:70px 0}
.one a{ margin:10px; padding:5px 10px; background-color:green; text-decoration: none; color:white}
.selected{background-color: yellow;}
</style>
<div class="one">
<a href="#first">1</a><a href="#second">2</a><a href="#third">3</a>
</div>

<div class="two">
<a href="#first">1</a><a href="#second">2</a><a href="#third">3</a>
</div>
<script>
$("a.one").click(function() {
    $(this).addClass(".selected").filter(':first').click();
});
</script>
4

3 に答える 3

0

このコードはあなたを助けます...

$("a").addClass(".selected");
于 2013-03-22T04:34:51.427 に答える
0

リンク

まず、アンカーのインデックスを見つける必要があります。次に、そのインデックスに基づいて 2 番目の div アンカーにクラスを適用します。

$('.two').children('a').eq($('.one a').index(this)).addClass('selected');

 $('.one').children('a').eq($('.two a').index(this)).addClass('selected');
于 2013-03-22T04:38:22.623 に答える
0

一緒に変更する必要があるすべてのリンクに共通するものを導入しようとします. これで、それらを識別するクラスを導入しました。

<style>
.one{margin:70px 0}
.one a{ margin:10px; padding:5px 10px; background-color:green; text-decoration: none; color:white}
.selected{background-color: yellow;}
</style>
<div class="one">
<a href="#first" class="1">1</a><a href="#second" class="2">2</a><a href="#third" class="3">3</a>
</div>

<div class="two">
<a href="#first" class="1">1</a><a href="#second" class="2">2</a><a href="#third" class="3">3</a>
</div>
<script>
    $(document).ready(function() {
        $("a.1").click(function() {
            $("a.1").addClass("selected");
            $("a:not(.1)").removeClass("selected");
        });
        $("a.2").click(function () {
            $("a.2").addClass("selected");
            $("a:not(.2)").removeClass("selected");
        });
       $("a.3").click(function () {
            $("a.3").addClass("selected");
            $("a:not(.3)").removeClass("selected");
        });
    });
    </script>

注: 対象のブラウザーが css3 をサポートしていない場合、:not セレクターに依存することはできず、「古いスタイル」のメソッドを使用してクラスを削除する必要があります。

于 2013-03-22T05:01:55.567 に答える