Question

我正在尝试在我的网页中创建一个远程模式（bootstrap4），我使用下面的URL，它仅适用于远程文件的模式内容，而其javascript无效。

Bootstrap 4 with remote Modal

有人可以告诉我如何让模态HTML的javascript进入显示远程模态的目标页面吗？

目标HTML代码： https://codepen.io/gorilla0823/pen/qLXQaM

远程模态： https://codepen.io/gorilla0823/pen/VqzVpR

我不知道为什么它的工作方式不同于我的起源。（我原来的一个是功能齐全的模式，我想让模式远程到达目标页面。）

模态（具有我的翻译功能，这是我希望在目标页面上显示的带有链接的内容）： http://sehomework.000webhostapp.com/translation/index(origin).html

模态的功能：第一个选项在翻译之前，而第二个选项在翻译之后，您可以选择语言，然后翻译或识别您键入的字母，这是我想显示的完整模式。但是，它现在可以与内容主体一起使用，如果代码无法完全正常工作，则会显示错误消息（未找到语音SDK）。

我想通过链接让模式远程访问页面，其内容起作用，而脚本不起作用，我评论了链接可以起作用和不起作用的代码是https://codepen.io/gorilla0823/pen/VqzVpR（与远程模态相同）

<!-- target.html -->
<div class="modal fade" id="theModal" tabindex="-1" role="dialog" aria- 
labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
I put my modal-content here.But the script doesn't work
</div>
</div>
</div>

<script type="text/javascript">
$('#theModal').on('show.bs.modal', function (e) {
var button = $(e.relatedTarget);
var modal = $(this);
modal.find('.modal-content').load(button.data("remote"));
});
</script>

<!-- remote modal -->
<div class="modal-header">
<script>    
//It doesn't work   
</script>
</div>
<!-- Modal body -->
<div class="modal-body">            
<div id="warning">
</div>
<script src="microsoft.cognitiveservices.speech.sdk.bundle.js"></script>
script>
//It doesn't work
</script>
</div>
<!-- Modal footer -->
<div class="modal-footer">
</div>

如何导入远程模态的JavaScript

0 个答案: