2017-06-21 24 views
-1

我創建了兩個html頁面。在同一幀中打開不同的頁面

<html> 
 
<body> 
 

 
<button type="button" onclick="alert('Hello world!')">Click Me!</button> 
 
    
 
</body> 
 
</html>

當我短聲的onClick按鈕,我想在同一框架中打開另一個HTML頁面。 我的第二個HTML

<html> 
 
<body> 
 

 
<h2>Spectacular Mountain</h2> 
 
<img src="pic_mountain.jpg" alt="Mountain View" style="width:304px;height:228px;"> 
 

 
</body> 
 
</html>`

我在Java中Springboot使用這些HTML文件。 最後,我想單擊第一個html頁面的按鈕,然後我想在同一個框架中顯示第二個頁面。

你能幫助我謝謝。

回答

0

錨怎麼樣?

<a href="anotherHtmlFile.html"> 
    Click me to access 2nd HTML file 
</a> 
+0

非常感謝您的建議:) – tester

+0

不客氣,接受最能幫助您關閉主題的答案:-) – Aigloun

+0

它很好,但它並不在同一頁中顯示,它只是重定向。 – tester

0

錨標籤應該做的伎倆,

<button type="button" onclick="alert('Hello world!')" > 
<a href="b.html">Click Me!</a> 
</button> 

'

+0

嗨,謝謝迪帕克:) – tester

+0

嗨迪帕克,你的解決方案是工作,但我的目的是在同一幀顯示第二個.html頁面。我的意思是它會在第一頁的前面。你有什麼想法我怎麼能做到這一點 – tester

0

術語 「框架」 是不正確基於我的理解。 Frame在HTML中有意義,所以我相信你真正想要做的是將第二個模板的內容拉入現有的模板中。如果是這種情況,那麼你必須使用某種Javascript和Ajax來實現你的目標。

我打算假設使用jQuery,因爲它是最簡單的示例類型。

<html> 
<body> 
    <button type="button" id="button1">Click Me!</button> 
    <div id="page2"></div> 
    <script> 
    $("#button1").on("click", function() { 
     $("#page2").load("http://url/to/other/page"); 
    }); 
</body> 
</html> 

上面的代碼會用按鈕註冊一個click事件,點擊後會加載第二頁並放入div的內容。還有其他方法可以通過各種Javascript技術和庫來實現。

+0

嗨格雷格,我嘗試在我的主頁面使用你的代碼塊。我將第二頁路徑設置爲$(「#page2」)。load(「page2.html」);然而它引起了恐慌 – tester

相關問題