萬盛學電腦網

 萬盛學電腦網 >> 腳本專題 >> javascript >> javascript實現鏈接單選效果

javascript實現鏈接單選效果

   本文實例講述了javascript實現鏈接單選效果的方法。分享給大家供大家參考。具體實現方法如下:

  ?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>鏈接單選</title> <script type="text/javascript"> function IniEvent() { var links = document.getElementsByTagName("a"); for (var i = 0; i < links.length; i++) { links[i].onclick = LinkOnClick; } } function LinkOnClick() { var links = document.getElementsByTagName("a"); //links在兩個地方用到了(IniEvent也用到了), //注意,不要把links放到全局變量中, //盡量不要用全局變量, //如果重復性代碼太多,將代碼放到一個公共函數中 for (var i = 0; i < links.length; i++) { if (links[i] == this) { links[i].style.background = "red"; } else { links[i].style.background = "white"; } } window.event.returnValue = false;//防止導航到網站 } </script> </head> <body onload="IniEvent()"> <a href="http://www.baidu.com">百度</a><br /> <a href="http://www.sohu.com">搜狐</a><br /> <a href="http://wwwlian.net">腳本之家</a><br /> <a href="http://www.tudou.com">土豆</a><br /> <a href="http://www.csdn.com">CSDN</a><br /> </body> </html>

  希望本文所述對大家的javascript程序設計有所幫助。

copyright © 萬盛學電腦網 all rights reserved