#javascript #forms #select #local-storage
#язык JavaScript #формы #выбирать #локальное хранилище
Вопрос:
Мне нужно сохранить значение lt;selectgt;
в локальном хранилище, однако я не могу этого сделать, я предполагаю, что это связано с тем, что lt;optiongt;
это lt;selectgt;
было динамически добавлено, и я должен обрабатывать его на более высоком уровне. Но я не знаю, как это сделать.
HTML
lt;select id="months" name="months"gt; lt;option value='january'gt; January lt;/optiongt; lt;option value='february'gt; February lt;/optiongt; lt;option value='march'gt; March lt;/optiongt; lt;option value='april'gt; April lt;/optiongt; lt;option value='may'gt; May lt;/optiongt; lt;option value='june'gt; June lt;/optiongt; lt;option value='july'gt; July lt;/optiongt; lt;option value='august'gt; August lt;/optiongt; lt;option value='september'gt; September lt;/optiongt; lt;option value='october'gt; October lt;/optiongt; lt;option value='november'gt; November lt;/optiongt; lt;option value='december'gt; December lt;/optiongt; lt;/selectgt; lt;select id="days" name="days"gt;lt;/selectgt;
JS
// dinamically add days const $months = document.getElementById('months') const $form = document.getElementById('form') function dayOfMonthOne() { for (let i = 1; i lt; 32; i ) { const days = ` lt;optiongt;${i}lt;/optiongt; ` const $days = document.getElementById('days') $days.innerHTML = $days.innerHTML days } } function dayOfMonthZero() { for (let i = 1; i lt; 31; i ) { const days = ` lt;optiongt;${i}lt;/optiongt; ` const $days = document.getElementById('days') $days.innerHTML = $days.innerHTML days } } function dayOfMonthEight() { for (let i = 1; i lt; 29; i ) { const days = ` lt;optiongt;${i}lt;/optiongt; ` const $days = document.getElementById('days') $days.innerHTML = $days.innerHTML days } } $months.addEventListener('change', function(){ switch ($months.value) { case 'january': $months.value = 'january' dayOfMonthOne() break case 'february': $months.value = 'february' dayOfMonthEight() break case 'march': $months.value = 'march' dayOfMonthOne() break case 'april': $months.value = 'april' dayOfMonthZero() break case 'may': $months.value = 'may' dayOfMonthOne() break case 'june': $months.value = 'june' dayOfMonthZero() break case 'july': $months.value = 'july' dayOfMonthOne() break case 'august': $months.value = 'august' dayOfMonthOne() break case 'september': $months.value = 'september' dayOfMonthZero() break case 'october': $months.value = 'october' dayOfMonthOne() break case 'november': $months.value = 'november' dayOfMonthZero() break case 'december': $months.value = 'december' dayOfMonthOne() break } }) const $days = document.getElementById('days') $days.addEventListener('change', function(){ const dVal = $days.options[$days.selectedIndex].text localStorage.setItem('day', dVal) })
Ответ №1:
Похоже, вам нужно изменить способ доступа к $days
свойствам:
const dVal = $days[$days.selectedIndex].text
или еще проще:
const dVal = $days.value
т. е. удалить .options
Дальнейшие усовершенствования заключались бы в создании единой функции для отображения days
параметров вместо гигантского switch
оператора, использующего несколько функций.
Вы также захотите запустить эту функцию при загрузке страниц, чтобы январь был заполнен.