按鈕回到主屏幕不工作

我得到的這個問題有點難以解釋，但我簡化並儘可能簡化。

聲明：
由於在下圖中很明顯，有9個敏感點擊的div，當你點擊其中任何一個時，會出現另一個屏幕，這在第二張圖片中也很明顯。 divs image 按鈕回到主屏幕不工作

問題：在第一個DIV，當我點擊返回主菜單，一切正常，但是，當我點擊第二個div，並單擊返回主菜單，按鈕不工作。我對這兩種方法使用了相同的backtoMain（）方法，但顯然有些問題是錯誤的。

second image

的JavaScript代碼我使用，使backToMainMenu按鈕的工作：

  function hideAllDivs() { /* the function that hides all divs */ 

       jQuery('#thirdVision').hide(); 
       jQuery('#forthVision').hide(); 
       jQuery('#fifthVision').hide(); 
       jQuery('#sixthVision').hide(); 
       jQuery('#seventhVision').hide(); 
       jQuery('#eightthVision').hide(); 
       jQuery('#ninethVision').hide(); 
       jQuery('#tenthVision').hide(); 
       jQuery('#eleventhVision').hide(); 
       //jQuery('#secondVision').show(); 
      } 
      function returnToMenu() { /* the function that shows main screen which is secondVision */ 
       hideAllDivs(); 
       jQuery('#secondVision').show(1400); /* shows secondVision "First Picture" in 1 and a half second */ 
      } 
      jQuery('#backToMain').click(function(e){ /* the function responsible for when "backtoMainMenu" button is clicked */ 
       returnToMenu(); 
       e.preventDefault(); 
      });

我一直在努力了3天，但無法弄清楚如何解決它。

來源

2013-01-01 Nima Sa

每個div容器都有單獨的後退菜單按鈕嗎？或者你爲所有人使用了一個通用按鈕？ –

我在每個div中使用此代碼作爲後退菜單按鈕： Back ToMain Menu –

@Nima你用相同的ID爲多個後退按鈕，而是使用類的ID

的情況下，HTML鏈接應該是

<a href="#" class="button big green backToMain"><span> Back To </span>Main Menu</a>

和腳本代碼應該是

jQuery('.backToMain').click(function(e){ 
     returnToMenu(); 
     e.preventDefault(); 
});

希望這會有所幫助！

來源

2013-01-01 16:27:47

謝謝，您節省了我的時間並給了我一次體驗。 –

使用類的ID，而不是像：

jsbin demo

獲得點擊的元素的index()使用.eq()方法

HTML檢索相關內容：樣品

<div id="container"> 

    <div class="box">Title 1</div> 
    <div class="box">Title 2</div> 
    <div class="box">Title 3</div> 
    ... 

    <div class="content">Content 1</div> 
    <div class="content">Content 2</div> 
    <div class="content">Content 3</div> 
    ... 

    <button id="backToMain">BACK TO MAIN</button> 

</div>

jQ：

(function($){ 

    $('.box').click(function(){   
    var myIndex = $(this).index(); 
    $('.content').eq(myIndex).show(); 
    $('#backToMain').show(); 
    }); 

    $('#backToMain').click(function(e){ 
     $(this).hide(); 
     $('.content').hide(); 
    }); 

})(jQuery);

來源

2013-01-01 16:30:50

按鈕回到主屏幕不工作

回答

相關問題