Bootstrap模式觸發其他模式時點擊它的身體

我遇到了一個頁面上運行的三種模式之一的問題。當它可見並且你點擊它的身體時，它會打開它後面的另一個。Bootstrap模式觸發其他模式時點擊它的身體

這是開放的一個：

   <span class="help-block"><a href="#klarnaModal" data-toggle="modal">@Html.Raw(ptype.Description.StripHtml())</a></span> 
       <div id="klarnaModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="klarnaModalLabel" aria-hidden="true" data-backdrop="static"> 
        <div class="modal-dialog"> 
        <div class="modal-contents"> 
         <div class="modal-header"> 
         <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
         <h3 id="klarnaModalLabel">@Html.Raw(ptype.Description)</h3> 
         </div> 
         <div class="modal-body"> 
         <iframe src="https://cdn.klarna.com/1.0/shared/content/legal/terms/24637/sv_se/invoice?fee=0"></iframe> 
         </div> 
        </div> 
        </div> 
       </div>

而且通過點擊對方身上打開一個：

<input type="radio" name="paymenttype" id="@ptype.Id" value="@ptype.Id" data-toggle="modal" data-target="#klarnaSubmitModal" data-remote="true" /> 
    <div id="klarnaSubmitModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="klarnaSubmitModalLabel" aria-hidden="true"> 
       <div class="modal-dialog"> 
       <div class="modal-contents"> 
        <div class="modal-header"> 
        <button type="button" class="close hidden" data-dismiss="modal" aria-hidden="true">&times;</button> 
        <h3 id="klarnaSubmitModalLabel"><i class="icon icon-info-sign"></i>Vigtigt</h3> 
        </div> 
        <div class="modal-body"> 
        Det er ikke muligt at benytte alternativ leveringsadresse sammen med Klarna Faktura.<br /><br /> 

        Vælger du at fortsætte vil din ordre blive leveret til faktureringsadressen.<br /><br /> 
        </div> 
        <div class="modal-footer"> 
        <button type="button" class="btn btn-medium btn-primary" id="acceptklarna-btn"> 
         <i class="icon icon-ok-sign"></i><b><span>Fortsæt</span></b> 
        </button> 
        <button type="button" class="btn btn-medium btn-primary" id="resetpayment-btn"> 
         <i class="icon icon-circle-arrow-down"></i><span>Vælg en anden betalingsmetode</span> 
        </button> 
        </div> 
       </div> 
       </div> 
      </div>

編輯！這再現了我的問題：http://jsfiddle.net/mPWw4/3/

爲什麼兩個連接，以便點擊第一個身體打開另一個？

來源

2013-11-04 nsordk

我已經設置了[的jsfiddle（http://jsfiddle.net/paulitto/mPWw4/1/）與你的HTML和..這兩個情態動詞，我常開，點擊模態的身體不會執行任何操作 – paulitto

似乎它必須是頁面上導致問題的其他內容。它是如何被放置的？ – nsordk

或許可以，張貼在這裏確切的代碼你有麻煩與，或設置的jsfiddle例如重現問題 – paulitto

將你的模態移到你的主html之外。我會推薦一些接近</body>標籤末尾的地方。
此外，只是作爲一個注意事項你的標記模式，例如<div class="modal-dialog">和<div class="modal-content">適用於Bootstrap 3.0，因爲您使用引導程序2.3.2，您並不需要它。

我通過將主模塊移出主html並且按預期工作更新了你的小提琴。

http://jsfiddle.net/mPWw4/4/

來源

2013-11-04 15:51:25 Trevor

非常感謝，現在我的頭髮可以長回來了;） – nsordk

Bootstrap模式觸發其他模式時點擊它的身體

回答

相關問題