Сохранение в localStorage из файла импорта HTML

Я использую импорт HTML, как средство для динамического добавления контента на сайт. Это работает, отлично, есть хорошая статья, которая разоблачает использование импорта как для файлов, так и для шаблонов.

Действительно, есть немного других статей, но Бидельман является наиболее обширным. Он охватывает скрипты в импорте. Однако, поскольку я могу отображать импортированный контент и запускать сценарии, я не могу сохранить данные в локальном хранилище.

Я могу запускать сценарии из импортированного файла, в файле импорта, как предупреждение. Однако невозможно поймать данные, которые мне нужны, чтобы хранить и хранить их. Как этого достичь? Вот пример моего кода.

У меня есть простой выбор, чей идентификатор dim_city. Скрипт для захвата значения при изменении и сохранения в локальном хранилище очень прост:

 var ie = importDoc.querySelector('#dim_city');   // capture the selector value.
   function getData() {
   var idc=ie.options[ie.selectedIndex].value;
   var  dataCi=(idc);
   localStorage.setItem("ic", dataCi);
   var storedData = localStorage.getItem(dataCi);

   mainDoc.body.appendChild(dataCi.cloneNode(true)); // this adds tha captured data to importer file.
 }    

Как один файл, он работает нормально и хранит данные в localStorage. При импорте он запускает сценарии, такие как alert, но не может храниться в localStorage.

Очевидно, что браузер поддерживает импорт HTML.

2 ответа

Согласно определению, импорт не имеет контекста просмотра, поэтому нет localStorage,

http://w3c.github.io/webcomponents/spec/imports/

Я нашел решение, да, любой импортированный файл сохраняет данные в localStorage. Итак, я собираюсь ответить себе:

Проблема заключается в получении значений из опций свойств селектора. Это старый метод, и он кажется конфликтующим в Chrome при импорте. Поэтому решение состоит в том, чтобы вместо этого получить выбранное значение:

var idc=ie.options[ie.selectedIndex].value;

использовать этот:

var idc=docuemnt.getElementById('dim_city').value;

С другой стороны, позвольте мне пояснить, что это правда, что DOM любого импортированного файла не является частью DOM импортера, он может обращаться как к своему собственному DOM, так и к DOM мастера - импортера, ссылаясь и добавляя свой DOM к master.

Другие вопросы по тегам