2014-07-14 19 views
0

我正在寫一個帶有HTML頁面的Sinatra應用程序。我創建了一個加載到每個頁面的.htm頭文件。這是標頭中的代碼,我怎麼把它加載到每一頁:標題鏈接加載到「標題」區域

<html> 
    <head> 
    <link type="text/css" rel="Stylesheet" href="/stylesheets/center.css" /> 
    </head> 
    <body> 
    <div> 
     <div style="height:80%"> 
     <div style="height:75%"> 
     </div> 
     <div style="height:25%;"> 
      <a href="/" style="padding-right:20px;padding-left:20px;vertical-align:bottom;">Home</a> 
      <a href="/page1" style="padding-right:20px;padding-left:20px;">Page 1</a> 
      <a href="/page2" style="padding-right:20px;padding-left:20px;">Page 2</a> 
      <a href="/page3" style="padding-right:20px;padding-left:20px;">Page 3</a> 
      <a href="/page4" style="padding-right:20px;padding-left:20px;">Page 4</a> 
      <a href="/page5" style="padding-right:20px;padding-left:20px;">Page 5</a> 
      <a href="/page6" style="padding-right:20px;padding-left:20px;">Page 6</a> 
      <div style="90%;"> 
      </div> 
     </div> 
     <div style="height:10%"> 
     <hr> 
     </div> 
    </div> 
    </body> 
</html> 

指數

<html> 
    <head> 
    <link rel="stylesheet" type="text/css" href="/stylesheets/background.css"> 
    </head> 
    <body> 
    <div> 
     <iframe name='header' id="header" src="header" frameborder="0" border="0" cellspacing="0" width="100%"></iframe> 
    </div> 
    "Something is coming!!" 
    </body> 
</html> 

我web.rb文件有以下每個頁碼:

get '/page2' do 
    send_file 'views/page2.html' 
end 

但是,使用此當前設置。當我點擊鏈接時,它會在「標題」區域加載整個新頁面。我期望它加載整個新頁面。我對Sinatra和一般的網絡編程都很陌生。關於爲什麼它會加載到標題區域而不是替換頁面的任何想法都會非常有幫助。

謝謝!

回答

1

它看起來像你想使用像erbhaml模板。

他們有一個佈局的概念,這意味着你可以創建一個佈局文件。

再培訓局,你可以創建一個名爲layout.erb

$cat views/layout.erb 
<html> 
    <head> 
    somethings 
    </head> 
    <body> 
    your navigation 
    <div id="content"> 
     <%= yield %> 
    </div> 
    </body> 
<html> 

現在,當您創建一個像index.erb視圖文件

$cat views/index.erb 
<span>Something is coming!!</span> 

,你可以用erb渲染,而不是send_file

get '/page2' do 
    erb :index 
end 

現在發生的事情是您的佈局引擎需要ca它的重新組合,並結合你的看法與你的佈局。如此簡單地解釋他們照顧到將您的視圖複製到您的佈局中<%= yield %>標籤所在的位置。

我建議查看sinatra doc views