如何將遠端資料載入到 Bootstrap 4 Modal 中？

Bootstrap 4 模態遠端資料載入

在最新版本的Twitter Bootstrap (v4 alpha) 中，能夠將遠端內容載入模式已刪除。此功能存在於 Bootstrap 3 中，但不再受支援。

問題

嘗試使用data-remote 屬性將遠端內容載入到Bootstrap 中的模態中時4、模型體保持為空，沒有請求傳送到指定的URL。

解決方案

要解決此問題，您可以使用 JavaScript 手動將遠端內容載入到模態主體中。以下是範例：

$('body').on('click', '[data-toggle="modal"]', function(){
        $($(this).data("target")+' .modal-body').load($(this).data("remote"));
    });  

此程式碼將事件偵聽器附加到具有 data-toggle="modal" 屬性的所有元素。當單擊這些元素之一時，它會從該元素檢索 data-remote 值，並使用 jQuery 的 .load() 方法將遠端內容載入到模態主體中。

注意：已棄用的遠端選項已在Bootstrap 4 中刪除，建議使用客戶端模板、資料綁定框架或透過手動呼叫jQuery.load() 來實現，如圖所示上面。

以上是如何將遠端資料載入到 Bootstrap 4 Modal 中？的詳細內容。更多資訊請關注PHP中文網其他相關文章！