如何將動態添加的選擇值存盤到本地存盤中？

我需要將 的值<select>存盤到本地存盤中，但是，我不能這樣做，我認為這是因為<option>這<select>是動態添加的，我應該在更高級別處理它。但我不知道如何做到這一點。

html

<select id="months" name="months">
            <option value='january'> January </option>
            <option value='february'> February </option>
            <option value='march'> March </option>
            <option value='april'> April </option>
            <option value='may'> May </option>
            <option value='june'> June </option>
            <option value='july'> July </option>
            <option value='august'> August </option>
            <option value='september'> September </option>
            <option value='october'> October </option>
            <option value='november'> November </option>
            <option value='december'> December </option>
        </select>

        <select id="days" name="days"></select>

js

// dinamically add days
const $months = document.getElementById('months')
const $form = document.getElementById('form')

function dayOfMonthOne() {
    for (let i = 1; i < 32; i  ) {
        const days = `
        <option>${i}</option>
        `
        const $days = document.getElementById('days')
        $days.innerHTML = $days.innerHTML   days
    }
}

function dayOfMonthZero() {
    for (let i = 1; i < 31; i  ) {
        const days = `
        <option>${i}</option>
        `
        const $days = document.getElementById('days')
        $days.innerHTML = $days.innerHTML   days
    } 
}

function dayOfMonthEight() {
    for (let i = 1; i < 29; i  ) {
        const days = `
        <option>${i}</option>
        `
        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)
})

uj5u.com熱心網友回復：

看起來您需要修改訪問$days屬性的方式：

const dVal = $days[$days.selectedIndex].text

或者更簡單：

const dVal = $days.value

即，洗掉 .options

進一步的改進是創建一個用于呈現days選項的函式，而不是switch使用多個函式的巨大陳述句。

您還需要在頁面加載時觸發該功能，以便填充一月。

標籤：javascript 形式 选择 本地存储

上一篇：單擊PHP中的保存按鈕后，顯示具有新更新資料的相同表單

下一篇：使用Javascript將省或州值傳遞給隱藏欄位