Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/411.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 选择输入搜索文本时未过滤的2_Javascript_Jquery_Jquery Select2 - Fatal编程技术网

Javascript 选择输入搜索文本时未过滤的2

Javascript 选择输入搜索文本时未过滤的2,javascript,jquery,jquery-select2,Javascript,Jquery,Jquery Select2,我已将select2升级到版本4。当我打开select2并输入搜索文本时,列表会根据我键入的内容进行过滤 这是HTML <select style="width: 100%;" id="fruit" multiple required> <option value="1">Apple</option> <option value="2">Pear</option> <option value="3"&

我已将select2升级到版本4。当我打开select2并输入搜索文本时,列表会根据我键入的内容进行过滤

这是HTML

<select style="width: 100%;" id="fruit" multiple required>
     <option value="1">Apple</option>
     <option value="2">Pear</option>
     <option value="3">Watermelon</option>
     <option value="4">Melon</option>
     <option value="5">Pineapple</option>
     <option value="6">Orange</option>
     <option value="7">Kiwi</option>
     <option value="8">Banana</option>
     <option value="9">Papaya</option>
     <option value="10">Tangerine</option>
 </select>

苹果
梨
西瓜
甜瓜
菠萝
橙色
几维鸟
香蕉
番木瓜
橘
这是给JS的

$(document).on('ready', function() {
    function matchCustom(params, data) {
        if ($.trim(params.term) === '') {
          return data;
        }
        if (typeof data.text === 'undefined') {
          return null;
        }
        var terms = params.term.split(" ");
        for (var i=0; i < terms.length; i++){
            if (data.text.toLowerCase().indexOf(terms[i].toLowerCase()) === -1) {
                return null;
            }
        }
        return data;
    }
    $('select').select2({
        matcher: matchCustom,
        closeOnSelect: false,
        multiple: true
    });
    var last_search = '';
    $('select').on('select2:open', function () {
        if (last_search != "") {
            $('#fruit').select2('search', last_search);
            $('.select2-search__field').val(last_search);
        }
    });
    $(document).on('keyup', '.select2-search__field', function () {
        var text = $('.select2-search__field').val();
        last_search = text;
    });
});
$(document).on('ready',function(){
函数匹配自定义(参数、数据){
如果($.trim(参数术语)=''){
返回数据;
}
if(typeof data.text===“未定义”){
返回null;
}
var terms=参数term.split(“”);
对于(var i=0;i
初始显示

当我打字时,这就是设计

在我选择了我想要的之后,列表仍然打开,搜索文本并没有消失。这不是问题。然而,当我点击另一个地方(这导致我的select2列表消失)并再次点击select2字段时,情况就是这样

最后一个搜索值是“ap”。列表中只包含单词中带有“ap”的值。但是,搜索文本是存在的。“ap”值未按预期显示在搜索文本中。此代码
$('.select2-search\uu field').val(上次搜索)未按预期工作

我还尝试删除此代码
$(“#fruit”)。选择2('search',last_search)位于select2 open事件内。当我第二次打开select2字段时,我遇到了另一个问题

“ap”值是我关闭select2列表之前的最后一次搜索。当我重新打开时,“ap”值显示在搜索文本中,这是正确的。但是,列表不会根据我搜索的内容进行过滤


重新打开select2字段后,我想要的结果是搜索值出现列表仅过滤我搜索的内容。我已经找了好几个小时了。有什么我遗漏的吗?

注意文档:。他们说:“对于多选框,没有明显的搜索控件。因此,要禁用对多选框的搜索,无论何时打开或关闭下拉列表,都需要将disabled属性设置为true。”我不想禁用搜索框。它是方便筛选所必需的。但它不能与multi-select一起正常工作…然后,例如,如果列表超过100,则如果所需值在底部列表中,则用户必须滚动到底部。