0

このコードを見つけました。ページが読み込まれたときに最初のリンクが既に選択されている必要があることを除いて、探しているものとほとんど同じです。

function CngClass(obj) {
 if (Lst) Lst.className=' ';
obj.className='selected';
Lst=obj;
}



<style type="text/css"> 
<!-- .selected { font: bold 18px Arial, Helvetica, sans-serif; color:#FF0000; } --> 
</style>  
<ul>  
<li>
<a id="homelink" onclick="CngClass(this);" href="#">Test 1
</a>
</li>  
<li>
<a onclick="CngClass(this);" href="#">Test 2
</a>
</li>  
<li>
<a onclick="CngClass(this);" href="#">Test 3
</a>
</li>  
</ul>
4

3 に答える 3

1

HTML

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<style type="text/css"> 
    .selected { font: bold 18px Arial, Helvetica, sans-serif; color:#FF0000; }
</style>  
<ul>  
<li>
    <a id="homelink" href="#">Test 1</a>
</li>  
<li>
    <a href="#">Test 2</a>
</li>  
<li>
    <a href="#">Test 3</a>
</li>  
​

Javascript

$(function(){
    $("#homelink").addClass("selected"); //adds selected class in the first link
    $("ul a").click(function(e){
        e.preventDefault();
        $("ul a").removeClass("selected");
        $(this).addClass("selected"); 
    });
});​
于 2012-11-14T17:38:08.510 に答える
0

変更されたコード: jsfiddle

  1. html の最初の 'a' に Selected クラスを追加しました。

  2. jQuery のクリック イベントを各アンカーにバインドし、select クラスを古いものから削除して、新しいものに追加します。



    • テスト 1

    • テスト 2

    • テスト 3 

    $("ul a").click(function(){
        $("ul a.selected").removeClass("selected");
        $(this).addClass("selected"); 
        return false;
});
于 2012-11-12T17:27:12.923 に答える
0

aこれを使用するだけです（タグからインラインのonclickイベントを削除してください）

HTML

<ul>  
<li>
    <a id="homelink" href="#">Test 1</a>
</li>  
<li>
    <a href="#">Test 2</a>
</li>  
<li>
    <a href="#">Test 3</a>
</li>

JS （タグで囲んだタグの間にhead挟むscript）

$(function(){
    $("ul a:first").addClass("selected"); //adds selected class in the first link
    $("ul a").click(function(e){
        e.preventDefault();
        $("ul a").removeClass("selected");
        $(this).addClass("selected"); 
    });
});​

デモ。

于 2012-11-12T17:36:54.000 に答える