可选过滤器下拉菜单出现问题

时间:2019-01-08 16:22:13

标签: selectize.js

我正在尝试为我的网站构建一个下拉选择过滤器菜单,用户可以在其中输入“ Kettle”,然后键入,它将出现在过滤器列表中,然后他们可以单击以选择它。

以下是我要制作的示例:https://www.jqueryscript.net/demo/Searchable-Dropdown-Select-jQuery-Selectstyle/

我遇到了一个git存储库:https://selectize.github.io/selectize.js/

我已经按照文档进行操作,所以我认为它目前无法正常工作。

我一直在研究错误,并没有停留在说它的一部分尚未定义但我有些困惑的时候。

enter image description here

有人能指出我正确的方向吗?有什么我忘记或错过的东西吗?

页面链接在这里:http://diamondcollective.co.uk/development/jellyfix/home/

    <select id="select-gear" class="demo-default selectized" placeholder="What's Broken..." tabindex="-1" style="display: none;">
    <option value="" selected="selected"></option>
</select>
<div class="selectize-control demo-default single">
    <div class="selectize-input items has-options not-full">
        <input type="select-one" autocomplete="off" tabindex="" id="select-gear-selectized" style="width: 81px; opacity: 1; position: relative; left: 0px;" placeholder="What's broken...">
    </div>
    <div class="selectize-dropdown single demo-default" style="display: none; width: 520px; top: 36px; left: 0px; visibility: visible;">
        <div class="selectize-dropdown-content">
            <div class="optgroup" data-group="Climbing"><div class="optgroup-header">Climbing</div>
            <div class="option" data-selectable="" data-value="bolts">Bolts</div>
            <div class="option" data-selectable="" data-value="cams">Cams</div>
            <div class="option" data-selectable="" data-value="nuts">Nuts</div>
            <div class="option" data-selectable="" data-value="pitons">Pitons</div>
            <div class="option" data-selectable="" data-value="sling">Sling</div>
            <div class="option" data-selectable="" data-value="stoppers">Stoppers</div>
        </div>
        <div class="optgroup" data-group="Skiing">
            <div class="optgroup-header">Skiing</div>
            <div class="option" data-selectable="" data-value="poles">Poles</div>
            <div class="option" data-selectable="" data-value="skins">Skins</div>
            <div class="option" data-selectable="" data-value="skis">Skis</div>
        </div>
    </div>
</div>

此处是第708行供参考:

        $.fn.removeHighlight = function() {
        return this.find("span.highlight").each(function() {
            this.parentNode.firstChild.nodeName;
            var parent = this.parentNode;
            parent.replaceChild(this.firstChild, this);
            parent.normalize();
        }).end();
    };

0 个答案:

没有答案