2013-07-14 62 views
1

今天我有以下問題。我想預先強調在我激活的活動鏈接上強調的腳本。我不知道該怎麼辦。你能給我一些建議嗎?jQuery/JavaScript我的腳本中的活動鏈接 - 壞下劃線

我有想法,但我不知道它是否是好的解決方案。

我認爲我應該準備css類。它應該是這樣的:

.active { 
text_decoration: underline; 
} 

我想我會用方法.addClass(「主動」)和removeClass(「主動」)

我編寫簡單的代碼,但它不proprely工作。

$(function(){ 

    $("li input").on("click", function(e) 
    { 
     $(this).addClass("active"); 
    }); 
}); 

現在我不知道如何刪除與先前的元素(對象)下劃線

<ul> 
        <li><input type="button" onClick="Clock(0)" value="MADRID" name="MADRID"/></li> 
        <li><input type="button" onClick="Clock(0)" value="AMSTERDAM" name="AMSTERDAM"/></li> 
        <li><input type="button" onClick="Clock(4)" value="ABU DHABI" name="ABU DHABI"/></li> 
        <li><input type="button" onClick="Clock(1)" value="LONDON" name="LONDON"/></li> 
        <li><input type="button" onClick="Clock(8)" value="HONG KONG" name="HONG KONG"/></li> 
        <li><input type="button" onClick="Clock(8)" value="CHINA" name="CHINA"/></li> 
        <li><input type="button" onClick="Clock(3)" value="ATHENS" name="ATHENE"/></li> 
        <li><input type="button" onClick="Clock(8)" value="SINGAPORE" name="SINGAPORE"/></li> 
        <li><input type="button" onClick="Clock(4)" value="MOSCOW" name="MOSCOW"/></li> 
        <li><input type="button" onClick="Clock(7)" value="JAKARTA" name="JAKARTA"/></li> 
       </ul> 

回答

0

你有一些錯誤

$(function(){ 
    var ins = $("li input").on("click", function(e) { 
     ins.not(this).removeClass('active') 
     $(this).addClass("active"); 
    }); 
}); 

.active { 
    text-decoration: underline; 
} 

演示:Fiddle

+0

OK,它的工作原理,我還有一個問題,我會喜歡在我刷新頁面時強調一個元素。 –

+0

@DawidPierwoła只需將活動類添加到所需元素 –

+0

好吧,我明白了。謝謝 –

0

如果你試圖讓只有一個按鈕激活時點擊時。

$(function(){ 

    $("li input").on("click", function(e) 
    { 
     $(this).addClass("active").siblings().parent().find('input').removeClass("active"); 

    }); 
}); 

而且你在你的css代碼片段中有一個錯字。 它應該是:

.active{ 
text-decoration:underline; 
} 

如果你想要一些元素在頁面刷新保持活躍,那麼你可以簡單的HTML標記添加「活動」類爲:

<li><input type="button" onClick="Clock(0)" value="MADRID" name="MADRID" class="active" /></li> 

上任何列表項的輸入你想

0

改變你類的聲明在CSS作爲

.active 
{ 
    text-decoration : underline; /* YOU HAD WRITTEN 'text_decoration' */ 
} 

取代 '_' 到 ' - '