更改部分重點放在Foundation CSS中的按鈕單擊

我正在使用Foundation CSS並需要一些關於節對象的幫助。我在我的頁面上有一個標籤頁部分更改部分重點放在Foundation CSS中的按鈕單擊

<div class="section-container tabs" data-section="tabs"> 
<section id="section1"> 
<p class="title" data-section-title><a href="#">Step 1</a></p> 
<div class="content" data-section-content> 
<input type="text" id="firstname" placeholder="First Name"> 
</div> 
</section> 

<section id="section2"> 
<div class="content" data-section-content> 
<input type="text" id="phone" placeholder="Phone"> 
</div> 
</section> 

What I am trying to do is have a next button on section1 that would take me to section 2 by using this 

<button class="small button" id="next1" onclick="document.getElementById('section2').className ='active';document.getElementById('section1').style ='padding-top: 49px';document.getElementById('section1').className ='';document.getElementById('section1').style ='';"> Next </button>

但是這不起作用。會發生什麼是，通過點擊按鈕，我會在第2部分簡要介紹部分，然後回到第1部分。

來源

2013-06-25 user2521760

不完整的代碼一起工作的成功。如何生根粉CSS？ –

一些CSS會很棒 – Muath

很少有東西丟失，其他人不明白。

您需要重點關注。與focus();所以它會把你帶到那裏。

如果元素沒有class attribute，則不能更改className。您需要先創建它，或者將它留在html中爲空。

要通過JavaScript更改樣式，您需要調用規則，然後爲其賦值。 element.style.paddingTop='49px';

要將注意力放在表單元素或鏈接以外的其他元素上，您可以將屬性tabindex="0"添加到您想要捕捉焦點狀態的元素。

對您的代碼進行了一些更改，以便您可以嘗試我說的一些事情。 http://codepen.io/gcyrillus/pen/pCikI

祝你在學習:)

來源

2013-06-25 22:44:35

試過這個，但是它仍然不能正常工作..''button class =「small button」id =「next1」onclick =「var mybt = document.getElementById（'section2'）; mybt.className =' active'; mybt.style ='padding-top：49px'; var omybt = document.getElementById（'section1'）; ombt.className =''; ombt.style =''; mybt.tabindex ='0'; mybt .focus（）;「>下一個'我在這做錯了什麼？ – user2521760

mybt.tabindex ='0'; mybt.style ='padding-top：49px'; ombt.style ='';這一切都是錯誤的。其餘的我不能說它繼承你的HTML代碼。我可以建議你閱讀這個頁面，拿起你需要的一些基本知識來啓動http://stackoverflow.com/tags/javascript/info –

更改部分重點放在Foundation CSS中的按鈕單擊

回答

相關問題