jQuery过滤器选择选项 [英] jQuery filter select options

问题描述

是否可以过滤特定的选择选项?

Is it possible to filter specific select options?

我有一个代码:

<select id="adcategory" name="adcategory">
    <option value="">Select</option>
    <option value="25" class="dropdownparentcategory">Florida Atlantic University</option>

    <option value="26">- Books </option>
    <option value="27">- Electronics</option>
    <option value="28">- For Rent</option>

    <option value="17" class="dropdownparentcategory">Florida International University</option>

    <option value="18">- Books</option>
    <option value="19">- Electronics</option>
    <option value="20">- For Rent</option>

    <option value="1" class="dropdownparentcategory">Florida Tech</option>
    <option value="2">- Books</option>
    <option value="3">- Electronics</option>
    <option value="7">- For Rent</option>


</select>

因此，如果变量$school = Florida Atlantic University比仅显示thoes options witch直到下一个学校类别(.dropdownparentcategory)，那么在这种情况下，它们将仅为:

So if the variable for example $school = Florida Atlantic University than show only thoes options witch is till next school category ( .dropdownparentcategory ), so in this case they would be only :

<select id="adcategory" name="adcategory">
    <option value="">Select</option>

    <option value="26">- Books </option>
    <option value="27">- Electronics</option>
    <option value="28">- For Rent</option>

</select>

如您在这张图片中所见:

As you can see in this image :

是否可以使用jQuery创建?

Is it possible to create with jQuery?

推荐答案

这看起来像是潜在的错误设计.我建议转到 <optgroup> ^[MDN] 标签将您的下拉菜单项分组:

This looks like potentially bad design. I would suggest moving to <optgroup> ^[MDN] tags to group your drop down items:

<select>
    <optgroup label="Florida Atlantic University">
        <option value="1">Text</option>
        <option value="2">Text</option>
        <option value="3">Text</option>
    </optgroup>
    <optgroup label="Florida Tech">
        <option value="4">Text</option>
        <option value="5">Text</option>
        <option value="6">Text</option>
    </optgroup>
</select>

然后选择子元素非常容易；

Then it's trivially easy to select child elements;

$('optgroup[label*="' + yourSchoolName + '"]').find('option')

这篇关于jQuery过滤器选择选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！