为什么在注入Bootstrap 4 Modal时没有加载javascript代码？

我有一个javascript函数，它打开一个Bootstrapmodal dialog：

function showModal(message, headerMessage, sticky, noFooter){ var modal = $('
',{ class: 'modal fade hide', role: "dialog", 'aria-labelledby': "modalTitle", 'aria-hidden': "true", tabindex: -1 }); var modalDialog = $('
',{ class: 'modal-dialog', role: "document" }); modal.append(modalDialog); var modalContent = $('
',{ class: 'modal-content' }); modalDialog.append(modalContent); var header = $('
',{ class: 'modal-header' }); if(headerMessage == undefined) headerMessage = " "; header.html("
"+headerMessage+'
 ×'); modalContent.append(header); var body = $('
',{ class: 'modal-body' }); body.html(message); modalContent.append(body); if(noFooter != true){ var footer = $('
', { class: 'modal-footer' }); footer.html('OK'); modalContent.append(footer); } var options = {}; options.show = true; if(sticky == true){ options.backdrop="static"; } modal.modal(options); return modal; }; 

在下一步中，我将从服务器加载HTML片段，我想将其作为消息传递给showModal()函数。 这是一个通过ajax从服务器加载并存储在JS-Variable mySnip的示例代码片段

 
Foo text
  alert("Alert1"); $(document).ready(function(){ alert("Alert2"); });  

之后，我打开Modal-Dialog，并将片段作为参数加载：

 showModal(mySnip, "Header", true, false); 

我的问题是，未加载代码段的Javascript部分。 有谁知道如何获取执行代码段的Javascript？ （以便显示警报）

背景：

我正在从Bootstrap 2迁移到Bootstrap 4.这个方法在Bootstrap 2中运行得非常好。我知道这可以通过其他方式实现，但我正在迁移一个大型应用程序，其中包含许多以这种方式工作的Modals 。

Answer 1

我想我找到了解决方案。 这是jQuery的一个问题，而不是Bootstrap。 jQuery根本就不再执行 -Tags的内容了。 我在return语句之前将它添加到我的showModal(...)函数的底部：

 ... if(message){ var reponseScript = $(message).filter("script"); $.each(reponseScript, function(idx, val) { eval(val.text); } ); } $(body).trigger('load'); ... 

它做什么：它从服务器响应过滤javascript。 之后它用eval执行。

$(body).trigger('load'); 执行注入的ready()函数内的代码。 我还需要再测试一下。 我担心，其他ready()方法也会被再次调用。

这里我的完整showModalfunction：

 therapy.showModal = function(message, headerMessage, sticky, noFooter){ var modal = $('
',{ class: 'modal fade hide', role: "dialog", 'aria-labelledby': "modalTitle", 'aria-hidden': "true", tabindex: -1 }); var modalDialog = $('
',{ class: 'modal-dialog', role: "document" }); modal.append(modalDialog); var modalContent = $('
',{ class: 'modal-content' }); modalDialog.append(modalContent); var header = $('
',{ class: 'modal-header' }); if(headerMessage == undefined) headerMessage = " "; header.html("
"+headerMessage+'
 ×'); modalContent.append(header); var body = $('
',{ class: 'modal-body' }); body.html(message); modalContent.append(body); if(noFooter != true){ var footer = $('
', { class: 'modal-footer' }); footer.html('OK'); modalContent.append(footer); } var options = {}; options.show = true; if(sticky == true){ options.backdrop="static"; } modal.modal(options); //$(modal).trigger('load'); // Get javascript if any and execute... // see: https://stackoverflow.com/a/7330106/1219104 if(message){ var reponseScript = $(message).filter("script"); $.each(reponseScript, function(idx, val) { eval(val.text); } ); } $(body).trigger('load'); return modal; };