加載HTML到引導模態破壞jQuery內部模態

我正在使用一個PHP框架（脂肪自由F3）與模板引擎來拼湊我正在設計的設計。主模板和所有.js文件正在layout.htm上加載。在layout.htm內部，我有一個鏈接，當點擊它時，觸發URL的內容顯示在引導模式窗口內。下面是代碼：加載HTML到引導模態破壞jQuery內部模態

<a href="/this/is/my/url" class="btn black mini icn-only" data-toggle="docs"><i class="icon-lock icon-large icon-white"></i></a> 

<script>  
$(document).ready(function() { 
    $('[data-toggle="docs"]').click(function(e) { 
     e.preventDefault(); 
     var url = $(this).attr('href'); 
     if (url.indexOf('#') == 0) { 
      $(url).modal('open'); 
     } else { 
      $.get(url, function(data) { 
       $('<div class="modal container hide fade" tabindex="-1" data-width="820"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button><h3 class="page-title">Title! <small> small txt</small></h3></div><div class="modal-body">' + data + '</div></div>').modal(); 
      }).success(function() { $('input:text:visible:first').focus(); }); 
     } 
    }); 
</script>

這裏面URL（/這/是/我/ URL），我嘗試使用下面的代碼使用引導提示功能：

<button class="btn tooltips" data-placement="top" data-original-title="Tooltip in top">Top</button>

的工具提示不會顯示在模式窗口的內部，但是如果我將它添加到模態窗口之外的主頁面，它就可以工作。所以我的問題是，如何在使用此模板引擎的同時在模態窗口中使用工具提示（或任何其他引導jquery事件）？我應該重新加載模態窗口內的bootstrap .js文件嗎？

令我困惑的是，css好像工作正常，因爲模態窗口包含一個引導表。我認爲jquery也可以工作，但我顯然是錯誤的。

絕對的任何反饋都會有很大的幫助。謝謝！

來源

2013-04-03 john

添加到您的jQuery的啓動，因爲它是聯繫在一起的元素tooltip是不是在頁面加載可見：

$(document).on('click', '[data-toggle="docs"]', function() { 
    $('.tooltips').tooltip(); 
});

來源

2013-04-03 16:13:33 adamdehaven

增加$提示（）;（」提示。）。在else語句幫助。我想它需要被初始化。我對jquery仍然陌生，我想我在這裏學到了一個寶貴的教訓。非常感謝回覆！ – john

它只是需要再次初始化，因爲在加載頁面時，模式中的'.tooltips'不存在，所以它們不會像頁面上不在模式中那樣初始化。 – adamdehaven

加載HTML到引導模態破壞jQuery內部模態

回答

相關問題