我點擊按鈕時沒有切換div元素，有誰知道我做錯了什麼？

-2

我在通過div元素切換時遇到問題。帳戶供稿div和帖子div div在css中沒有任何顯示。控制檯說，它有22行空的麻煩理解的addEventListener這是我對JavaScript的顯示：我點擊按鈕時沒有切換div元素，有誰知道我做錯了什麼？

const accountFeed = document.getElementById('accountFeed') 
const accountFeedButton = document.getElementById('accountFeedButton') 

const homePage = document.getElementById('homePage') 
const homePageButton = document.getElementById('defaultPageButton') 

const postPage = document.getElementById('tweetPage') 
const postPageButton = document.getElementById('posts-button') 

const hide = (item) => { 
    item.style.display = 'none' 
} 
const show = (item) => { 
    item.style.display = 'inline' 
} 

accountFeedButton.addEventListener('click',() => { 
    alert('accountFeedButton') 
    hide(homePage) 
    hide(postPage) 
    show(accountFeed) 
}) 
homePageButton.addEventListener('click',() => { 
    alert('homePageButton') 
    hide(accountFeed) 
    hide(postPage) 
    show(homePage) 
}) 
postPageButton.addEventListener('click',() => { 
    alert('postPageButton') 
    hide(homePage) 
    hide(accountFeed) 
    show(postPage) 
})

我有三個div的。在一個單獨的html文件中的每一個。包含按鈕的div不是主頁div的一部分。我把它包括在內，以防萬一我搞砸了按鈕。主頁DIV：

<div id="wrapper"> 
    <button class="pageContent" id="defautPageButton">Home</button> 
    <button class="pageContent" id="accountFeedButton">Account Feed</button> 
    <button class="pageContent" id="posts-button">Post</button> 
</div> 
<div id="homePage" class="tabContent"> 
    <ul id="posts"> 

    </ul> 
</div> 
<script src="page-loader.js"></script>

帳戶供稿格：

<link rel="stylesheet" href="style.css"> 
<div id="accountFeed" class="tabContent"> 
    <p style="display: none">*</p> 
    <ul id="posts"> 
     <li>Hello</li> 
    </ul> 
</div>

帖子頁面的div：

<link rel="stylesheet" href="style.css"> 
<div id="tweetPage" class="tabContent"> 
    <textarea class="post" rows="3"></textarea> 
     <button id="post-a-comment">Post</button> 
</div> 
<script src="page-loader.js"></script>

來源

2017-06-12 The Gamer

有一個可重複的例子與jsfiddle或任何人都可以試用它總是更好..我知道我不會打擾至少 – Ced

不知道是什麼原因導致你的問題，但你有'defautPageButton'它在哪裏看起來像你想'defaultPageButton'，這絕對不會幫助。這是''button class =「pageContent」id =「defautPageButton」>首頁'。 –

我同意@Peter，'defautPageButton'應該是'defaultPageButton'，這可能會導致它拋出一個錯誤。 –

您的按鈕HTML一個錯字：

<button class="pageContent" id="defautPageButton">Home</button>

該ID應該是默認 PageButton。這應該可以解決你的問題。

來源

2017-06-12 19:53:50 sorayadragon

我點擊按鈕時沒有切換div元素，有誰知道我做錯了什麼？

回答

相關問題