Источник JS не виден в отладчиках Chrome / Firefox, но правильно загружен на странице - PullRequest
0 голосов
/ 17 сентября 2018

У меня есть веб-страница, которая выполняет навигацию с использованием шаблонов и заполняет / показывает их в зависимости от взаимодействия с пользователем.

Работает довольно хорошо, но шаблоны содержат некоторые JS, включенные в них. Этот код JS правильно загружен (в приведенном ниже примере он выдает предупреждение «Привет»), когда страница только что загружена. Однако я не вижу кода в консоли отладчика ни в Chrome, ни в Firefox.

Ниже приведен минимальный пример, в котором я вижу в консоли> Source под localhost только мою HTML-страницу и jquery.min.js в подпапке asset / js.

Вот мой HTML:

<script src="assets/js/jquery.min.js"></script>
<template id="my_screen">
    Hello
    <script type="application/javascript" src="assets/js/testouille.js"></script>
</template>

<section class="container">
    <div class="my_screen hide"></div>
</section>


<script type="application/javascript">
    function useTemplate(elem) {
        var myTemplate = $('#' + elem),
            normalContent = $('.' + elem),
            clonedTemplate = myTemplate.html();
        normalContent.empty();
        normalContent.append(clonedTemplate);
    }

    $(document).ready(function() {
        useTemplate('my_screen');
    }
    )
</script>

А вот и мой Javascript:

alert("Hi");

Есть идеи?

1 Ответ

0 голосов
/ 17 сентября 2018

Поскольку testouille.js находится в <template>, он не загружается автоматически браузером при загрузке страницы.

Когда вы клонируете шаблон и добавляете его в обычный DIV, jQuery эмулирует загрузкуфайл с использованием $.getScript().В отладчике Chrome код, который загружается таким образом, будет отображаться с именем файла VM:#### (где #### - произвольное число) в источниках, а не с его фактическим именем файла.

Вы можете сделать отладчикдайте ему имя файла, поместив следующий комментарий в testouille.js:

//# sourceURL=testouille.js
...