2013-03-24 89 views
0

問題描述顯示引導定製模式

我有兩個看法。第一個包含一個鏈接,點擊後應顯示第二個視圖,這是我的自定義模式。這兩個文件都位於名爲學校的相同文件夾中。

代碼

firstView.html

<html> 
    <head>Click the link</head> 
    <body> 
    <div> 
    <a data-toggle="modal" href="secondView.html" data-target="#secondView" >Additional Details</a> 
    </div> 
    </body> 
</html> 

secondView.html

<!-- Modal --> 
<div id="secondView" class="modal hide fade" tabindex="-1" role="dialog" aria- labelledby="myModalLabel" aria-hidden="true"> 
<div class="modal-header"> 
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
<h3 id="myModalLabel">Modal header</h3> 
</div> 
    <div class="modal-body"> 
     <p>One fine body…</p> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
    <button class="btn btn-primary">Save changes</button> 
    </div> 

</div> 

手頭問題

問題是,當我點擊我的鏈接,它不顯示任何東西。我檢查了控制檯,並沒有顯示任何錯誤。所以,我認爲這與我連接這兩個視圖的方式有關,可能與href標記有關。

我會感謝您的幫助人。

回答

1

http://twitter.github.com/bootstrap/javascript.html#modals

如果提供了一個遠程URL,內容將被經由jQuery的負載方法加載並注入.modal體。

所以,你會怎麼做

firstView.html

<html> 
    <head>Click the link</head> 
    <body> 
    <div> 
    <a data-toggle="modal" href="secondView.html" data-target="#myModal" >Additional Details</a> 
    </div> 

    <!-- Modal --> 
    <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-    labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
     <h3 id="myModalLabel">Modal header</h3> 
    </div> 
    <div class="modal-body"> 
     <!-- Here be modal content --> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
    <button class="btn btn-primary">Save changes</button> 
    </div> 
    </div> 
    </body> 
</html> 

secondView.html

<p>One fine body…</p> 
+0

好吧,讓我進行更改,然後我會告訴你知道它是否有效。 – Stranger 2013-03-24 16:34:36

+0

我提出了所有更改,但無效。我三倍檢查我的代碼,一切似乎工作正常。 – Stranger 2013-03-24 16:42:52

+0

我在上面的代碼中添加了我的更改。 – Stranger 2013-03-24 16:48:46