在Chrome擴展中的iframe中使用Twitter Bootstrap

Question

我正在研究一個chrome擴展，它通過在呈現時附加事件偵聽器來在動態創建的元素上使用Bootstrap Collapse（v2.3.2）功能。我遇到了一個問題，即在加載我的擴展時，在父頁面上使用摺疊不再有效。我測試了這個bootstrap's documentation，並能夠重現。在我的擴展功能正常運行的時候，崩潰停止了。我認爲當我加載我的bootstrap.js版本時，必定會對全局jQuery對象造成一些污染。

這是我表現的腳本部分：

"content_scripts": [{ 
    "run_at": "document_start", 
    "matches": ["<all_urls>"], 
    "js": [ 
    "js/vendor/jquery-min.js", 
    "js/vendor/bootstrap.min.js", 
    "js/content_script.js", 
    ] 
}] 

而且裏面js/content_script.js

// #render 
function render() { 
    $elInIframe.find('.accordion-toggle').on('click', function() { 
     var targetName = $(this).attr('data-target'); 
     var target = $elInIframe.find(targetName); 
     target.collapse('toggle'); 
    }); 
} 

我的分機的生命週期是：

1. 負載content_script（使用jQuery和引導通過擴展加載爲content_scripts）。
2. 初始化並注入iframe。
3. asyncronously獲取數據，並注入作爲HTML的iframe
4. 呼叫呈現內，在iframe

所以要澄清點擊監聽器連接到元素，我的擴建工程符合市場預期，但我打破頁也使用bootstrap.js。

作爲一種可能的解決方案，我嘗試將bootstrap.js移動到web_accessible_resource並將其加載到模板中。但是，這樣做後，調用target.collapse會導致錯誤（不是函數），因爲我的擴展使用的jquery沒有通過加載bootstrap.js來修改 - 我甚至不確定引導程序是否在iframe中正確加載擴展名。

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.