Javascript點擊一個特定的鏈接並顯示div（沒有jQuery）

-1

我有一個列表或項目，我想添加一個類到一個div，一旦你點擊某個列表項目（即在這個例子中，最後一個列表項目）。Javascript點擊一個特定的鏈接並顯示div（沒有jQuery）

代碼示例如下：

 <ul class="tier-1"> 
      <li class="first"> 
       <a href="/">HOME</a> 
      </li> 
      <li> 
       <a href="">SECTIONS</a> 
      </li> 
      <li class="Login Nav Link last"> 
       <a href="#login" class="Logi Nav **Link**">LOGIN</a> 
      </li> 
     </ul> 
     <div class="nav-login"></div>

點擊「登錄」鏈接，並在div「導航登錄」應該添加類「秀」。

注意：我無法更改標記。

來源

2011-05-18 calebo

到目前爲止，您是否有任何JavaScript代碼？ – John 2011-05-18 07:22:22

-1，因爲你沒有提供足夠的細節給人們給你一個合理的答案。 – slugster 2011-05-18 08:02:05

試試這個：

<li class="Login Nav Link last"> 
    <a href="#login" class="Login Nav Link" onclick="toggle()">LOGIN</a> 
</li> 

<div id="nav-login"></div> 

<script> 
function toggle(){ 
    var div1 = document.getElementById('nav-login') 
    if (div1.style.display == 'none') { 
     div1.style.display = 'block' 
    } else { 
     div1.style.display = 'none' 
    } 
} 
</script>

注意，對於這個方法，你需要改變類=「導航登錄」進入ID =「導航登錄」

來源

2011-05-18 07:22:12

也許應該將鏈接的切換功能掛鉤？ – ADW 2011-05-18 07:24:04

我認爲你誤解了我的問題。問題是具有相同類名'鏈接'的2個元素，並且我需要針對與類「鏈接」相關的超鏈接的點擊或目標最後列表項的超鏈接。然後用類名「nav-login」切換div，並且我無法將該類更改爲div上的ID。 – calebo 2011-05-18 07:24:40

可能很重要的一點是，在將click方法添加到錨點之前，您需要等待DOM做好準備。 – peterp 2011-05-18 07:25:20

這應該與您的標記工作。你可能不應該依靠抓住最後一個元素，那就是保持答案的簡短。您應該檢查元素類名。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> 
<html> 
    <head> 
     <script language="javascript" type="text/javascript"> 
     window.onload = function() { 
      var links = document.getElementsByTagName("a"); 
      links[links.length-1].onclick = function() { 
       var divs = document.getElementsByTagName("div"); 
       divs[divs.length-1].className += " show"; 
      } 
     } 
     </script> 
    </head> 
    <body> 
     <ul class="tier-1"> 
      <li class="first"> 
       <a href="/">HOME</a> 
      </li> 
      <li> 
       <a href="">SECTIONS</a> 
      </li> 
      <li class="Login Nav Link last"> 
       <a href="#login" class="Login Nav Link">LOGIN</a> 
      </li> 
     </ul> 
     <div class="nav-login"></div> 
    </body> 
</html>

來源

2011-05-18 07:31:25 jopke

我剛剛在下面看到您的評論，我會更新我的回答 – jopke 2011-05-18 07:34:02

我不允許編輯加價。 – calebo 2011-05-18 07:34:56

我必須跑步。在你的JavaScript你應該能夠做document.getElementsByTagName（「a」）來獲取頁面上的所有錨點並綁定click事件。一旦你完成了，做同樣的事情來獲得div並添加類。 – jopke 2011-05-18 07:50:42

Javascript點擊一個特定的鏈接並顯示div（沒有jQuery）

回答

相關問題