0

我正在使用texttext插件进行自动完成、自动建议等。

每当用户搜索国家或城市时,我都有一个目标字段,即文本框,它应该在下拉列表中填充或建议匹配的城市或国家。

例如,如果用户搜索为“Ameri”

电流输出

来自 textext 插件正在检索包含搜索文本“Americ”的所有字符串

  • 北美
  • 南美洲
  • 美利坚合众国
  • 美国峡谷
  • 美国河

预期的输出 需要匹配字符串的列表,它以搜索的文本“Americ”开头,结果应该首先出现,稍后搜索的文本包含该列表。

字符串以

  • 美国峡谷
  • 美国河

包含列表

  • 北美
  • 南美洲
  • 美利坚合众国

$('#textarea').textext({
         plugins: 'tags autocomplete filter focus',
         minLength: 3,
     })
     .bind('getSuggestions', function(e, data) {
         if (data.query.length) {
             var list = [
                     'United states of America',
                     'South America',
                     'India',
                     'Delhi',
                     'Pune',
                     'North America',
                     'American River ',
                     'American canyon'
                 ],
                 textext = $(e.target).textext()[0],
                 query = (data ? data.query : '') || '';
             $(this).trigger(
                 'setSuggestions', {
                     result: textext.itemManager().filter(list, query)
                 }
             );
         }
     });
<textarea id="textarea" class="example" rows="1"></textarea>

4

1 回答 1

0

我已经通过在 texttext 插件上添加部分代码自己解决了这个问题,如果我的方法不正确,请纠正我。这是它的演示 - http://holidays.coxandkings.com/

$('#textarea')
    .textext({
        plugins : 'autocomplete filter',
        useSuggestionsToFilter : true
    })
    .bind('getSuggestions', function(e, data)
    {
        var list = [
                'United states of America',
                'South America',
                'India',
                'Delhi',
                'Pune',
                'North America',
                'American River ',
                'American canyon'
            ],
            textext = $(e.target).textext()[0],
            query = (data ? data.query : '') || ''
            ;

        // Implementing search functionality from the begining of the string, later dispalying the contains list.
        var filterItems = textext.itemManager().filter(list, query);
        var filteredResultCount = filterItems.length;
        var beginingMatches = [];
        var containsMatches = [];
        for (var i=0; i < filteredResultCount; i++) {
            if(filterItems[i].toLowerCase().indexOf(query.toLowerCase()) == 0 ) {
                beginingMatches.push(filterItems[i]);
            }else{
                containsMatches.push(filterItems[i]);
            }
        }
        var finalResult = beginingMatches.concat(containsMatches);
        $(this).trigger(
            'setSuggestions', { result : finalResult}
        );
    });
于 2018-01-18T10:10:09.717 回答