Typehead.js: поиск с клавишей ввода и выберите первый элемент в списке - PullRequest
Новая
       60

Typehead.js: поиск с клавишей ввода и выберите первый элемент в списке

0 голосов
/ 02 июня 2019

я использую typehead.js Страна v.2 Пример: http://www.runningcoder.org/jquerytypeahead/demo/

Когда пользователь вводит три или более символов и нажимает клавишу ввода первый элемент, соответствующий символамдолжен быть выбран в списке.Затем пользователь должен быть перенаправлен на этот URL-адрес на основе этого поискового ключевого слова.

с выпадающими подсказками, что работает пользователь получает перенаправление на другой URL-адрес, если пользователь щелкаетв выпадающих списках стран.

Если в списке не найдено подходящего ключевого слова, пользователя следует перенаправить на другой URL.

Я попробовал этот код, но он не работал: Нажатие клавиши ввода не приводит к поиску 

><head>
>    <link rel="stylesheet" href="src/jquery.typeahead.css">

>    <script src="src/jquery-2.1.0.min.js"></script>
>    <!--script src="../dist/jquery.typeahead.min.js"></script-->
>    <script src="src/jquery.typeahead.js"></script>
    ><script src="src/bloodhound.js"></script>
></head>

Вот форма: 

><form>
>   <div class="typeahead__container"><div class="typeahead__field"><div >class="typeahead__query"><input class="js-typeahead" name="q" >type="search" autofocus autocomplete="on"></div><div >class="typeahead__button"><button type="submit"><span >class="typeahead__search-icon"></span></button></div></div>
>   </div>
>   </form>

последняя часть, которую я изменил, чтобы не отображать окно предупреждения "вы будете перенаправлены наURL "(см. Пример с запущенным кодером): 

  hint: true,
               dropdownFilter: "Categories",
                href: "https://en.wikipedia.org/wiki/{{display}}",
                template: "{{display}}, <small><em>{{group}}</em></small>",
               emptyTemplate: "no result for {{query}}",
                source: {
                   country: {
                        data: data.countries                },
                    capital: {
                        data: data.capitals
                    }
                },
               callback: {
                   onClickAfter: function () {
                this.hideLayout();
                 },
                    onResult: function () {
                this.hideLayout();
                }
               },
              debug: true

Спасибо

...