Question

需要在bs3 ajax模式加载后重新初始化js。在这个例子中，复选框没有被制服样式化，因为在js之后加载了模态。所以，我需要在模态加载后初始化js，以便在这些元素上显示正确的样式。

主要：

<a href="/modals/m_comp_settings.php?id=12" data-target="#modal-ajax" data-toggle="modal">Change settings</a>

<!-- ajax remote modal entry -->
<div class="modal fade" id="modal-ajax" tabindex="-1" role="basic" aria-hidden="true">
    <img src="/assets/img/ajax-modal-loading.gif" alt="" class="loading">
</div>
<!-- END MODALS -->

m_comp_settings.php（模态）： 模式当然是格式正确的，但这里是一个输入的例子，应该用统一的样式。

<label><input type="checkbox" name="hide" checked disabled> test</label>

我的假设：

$('#modal-ajax').on('shown.bs.modal', function() { 
    App.initAjax();
});

我认为这样可行。在加载模态后，shows.bs.modal应该触发，然后我通过App.initAjax（）重新初始化uniform。此调用基本上初始化了我的站点的一些核心处理程序。我知道这正常工作，因为我在ajax加载调用后使用它。例如：

$('#show_comps').load('/process/p_show_comps.php', function() {
    $('#show_comps').fadeIn('slow');
    // reinit js handlers on loaded content
    App.initAjax(); // reinitializes the core stuff
    // show success toast
    toastr.info("'<b>"+response.computer_name+"</b>' was deleted from your account.");
})

EDIT 其他测试：

使用以下代码，在点击之后和模态出现之前显示警报。将此更改为“显示”，根据文档应该在屏幕上“显示”后没有任何反应。是什么给了什么？

$('#modal-ajax').on('show.bs.modal', function () { 
    console.log();
    alert('hi');
});

Answer 1

我今天遇到了这个问题，尝试将通过ajax加载的内容与Bootstrap事件的shown.bs.modal模型进行互动。据我所知，由于ajax（根据定义）异步，因此模式显示之前 ajax加载的内容已经......装了。我查看了Bootstrap js文件，我没有看到任何迹象显示所显示的事件等待以完成ajax。因此，您无法依靠shown.bs.modal与ajax加载的内容进行互动。

我认为您需要依赖function来加载ajax，这可能意味着要编写包装function以与Bootstrap进行互动模态，加载ajax，然后执行您需要的任何操作。

在bs ajax模态加载后初始化js

1 个答案: