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>