jquery - Jquery select2 不适用于多个“optgroup”

Question

我正在使用 Jquery select2，我有一个这样的选择框

<select multiple="multiple" id="address">
    <optgroup class="op1" label="Maryland">
        <optgroup class="op2" label="Perth">
            <option value="West Baltimore Street, Baltimore, MD">West Baltimore Street, Baltimore, MD</option>
            <option value="Massachusetts">Massachusetts</option>
            <option value="Njurunda, Sweden">Njurunda, Sweden</option>
        </optgroup>
    </optgroup>

    <optgroup class="op1" label="Kerala">
        <optgroup class="op2" label="Ernakulam">
            <option value="Ernakulam, Kerala, India">Ernakulam, Kerala, India</option>
            <option value="Muvattupuzha, Kerala, India">Muvattupuzha, Kerala, India</option>
        </optgroup>
        <optgroup class="op2" label="Idukki">
            <option value="Thodupuzha, Kerala, India">Thodupuzha, Kerala, India</option>
        </optgroup>
    </optgroup>
</select>

我得到的输出select2

我的实际输出应该是这样的

那<optgroup class="op1" label="kerala">是缺失的。知道怎么做吗？

Answer 1

看起来它有未关闭的 html 标签，请验证您的 html。经过验证的标记看起来像这样

<select multiple="multiple" id="address">
    <optgroup class="op1" label="Maryland"></optgroup>
    <optgroup class="op2" label="Perth"></optgroup>
    <option value="West Baltimore Street, Baltimore, MD">West Baltimore Street, Baltimore, MD</option>
    <option value="Massachusetts">Massachusetts</option>
    <option value="Njurunda, Sweden">Njurunda, Sweden</option>
    <optgroup class="op1" label="Kerala"></optgroup>
    <optgroup class="op2" label="Ernakulam"></optgroup>
    <option value="Ernakulam, Kerala, India">Ernakulam, Kerala, India</option>
    <option value="Muvattupuzha, Kerala, India">Muvattupuzha, Kerala, India</option>
    <optgroup class="op2" label="Idukki"></optgroup>
    <option value="Thodupuzha, Kerala, India">Thodupuzha, Kerala, India</option>
</select>