IE ругается при подключении внешнего файла

[ozoro]

Есть модальное окно, в нем ссылка на вызов еще одного окна с политикой конфиденциальности.

Во всех браузерах работает нормально, но в IE не работает, в консоли ошибка "Недопустимый знак". Ругается на тильду. Но пробовал кавычки и одинарные и двойные, но тоже ругается.

Как победить это? Или подскажите другое решение, как подключить внешний файл с кодом модального окна.


вызов:

<a data-toggle="modal" data-target=".privacy_policy">Политика конфиденциальности</a>

код подключаемого файла:

function newModal() {
	var newModal = `
<div class="modal fade privacy_policy" tabindex="-1" role="dialog">
  <div class="modal-dialog md-custom" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>        
        <h4 class="modal-title">Политика конфиденциальности</h4>
      </div>      
      <div class="modal-body">
	  
<p>Любая информация, переданная Сторонами друг другу при пользовании ресурсами Сайта, является конфиденциальной информацией.</p>
<p>....</p>
<p>....</p>
...
<button type="button" class="more buttons blue" data-dismiss="modal" aria-hidden="true">Закрыть</button>	  
	  </div>
    </div>
  </div>
</div>
  `;
  $('body').append(newModal);
}

$('a').on('click', newModal);

Вот подобный пример:
https://jsfiddle.net/vh88u4uh/

[Malleys]

А так работает там? https://jsfiddle.net/fzymr5jg/

[ozoro]

Malleys,
Да, так работает. Но мне нужно чтобы подключалось из внешнего файла, чтобы не захламлять исходный код.

Код модального окна с политикой конфиденциальности не нужен в исходном коде. Сам текст политики - целая "простыня" и никак не относится к тематике сайта. Зачем его тащить на все страницы сайта. Для SEO не айс.

[Malleys]

Но мне нужно чтобы подключалось из внешнего файла, чтобы не захламлять исходный код.

Cоздайте /privacy_policy.html с HTML-кодом
код подключаемого файла:

$(function(){
	$.ajax("/privacy_policy.html", {
    success: function(html) {
      function newModal() {
        $('body').append(html);
      }
      $('button').on('click', newModal);
    }
  });
});

[Aetae]

ozoro, а проблема в том, что только `` поддерживает переносы в строке. Но ie не понимает ``. Обычные же кавычки, соответственно, переносы не поддерживают, так что просто заменив одни на другие - получаешь невалидный в принципе код.
Чтоб заработало твоё решение - надо нарубить строку. Но лучше конечно использовать вариант Malleys, и хранить html отдельно как html.

[ozoro]

Malleys,
Благодарю, все заработало.

[ozoro]

Malleys,
Не подскажешь еще. Я вызываю модальное окно из другого модального окна. При открытии первого модального окна в инспекторе появляется код из privacy_policy.html

<script type="text/x-template" id="modal-template">код мод. окна</script>

Если закрыть это окно и открыть вновь, то уже получается:

<script type="text/x-template" id="modal-template">код мод. окна</script>
<script type="text/x-template" id="modal-template">код мод. окна</script>

Если несколько раз так сделать, то будет много строк:

<script type="text/x-template" id="modal-template">код мод. окна</script>
<script type="text/x-template" id="modal-template">код мод. окна</script>
<script type="text/x-template" id="modal-template">код мод. окна</script>
<script type="text/x-template" id="modal-template">код мод. окна</script>
<script type="text/x-template" id="modal-template">код мод. окна</script>
<script type="text/x-template" id="modal-template">код мод. окна</script>
....

Как удалить дубликаты этого кода при закрытии первого модального окна, оставив только один. Но не удалять при закрытии окна с политикой конфиденциальности?

Или просто удалять при закрытии первого окна, но не удалять при закрытии окна с политикой конфиденциальности?

[Malleys]

Создайте элемент на странице, куда должен вставляться HTML, например, <div id="my-modal"></div>

Далее вместо добавления в body

$('body').append(html);

вставляйте в тот элемент

$('#my-modal').html(html);

А удалить, можно так

$('#my-modal').empty();

[ozoro]

Malleys,
Благодарю, так даже и удалять не нужно, ничего лишнего, только один раз вставляется.