Как импортировать удаленный модальный JavaScript - PullRequest
Новая
       61

Как импортировать удаленный модальный JavaScript

0 голосов
/ 27 декабря 2018

Я пытаюсь сделать удаленный модальный (bootstrap4) на своей веб-странице, я использую приведенный ниже URL, и он работает только с модальным контентом удаленного файла, в то время как его javascript не работал.

Bootstrap 4 с удаленным модальным

Может кто-нибудь сказать мне, как добавить javascript модального HTML на целевую страницу, которая показывает модальное в удаленном режиме?

Целевой 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>
...