Автозаполнение jQuery - добавлено, предлагает не кликабельны - PullRequest
Новая
       28

Автозаполнение jQuery - добавлено, предлагает не кликабельны

0 голосов
/ 04 июля 2019

Я пытаюсь заставить работать автозаполнение jquery.При вводе ввода предложения отображаются, как и ожидалось.Проблема, с которой я борюсь, заключается в том, чтобы сделать добавленные данные активными, чтобы ввод был заполнен нажатием на значение.Когда я нажимаю на подсказку, ничего не происходит, когда я нажимаю клавишу «Вниз» и нажимаю «Ввод», автозаполнение происходит, как и ожидалось.Как получить элементы, на которые можно нажимать?

Найти демо здесь: https://www.teamazing.de/test-locationsuche/

Вот мой код (примечание: я использую "jQuery" вместо "$", чтобы сделать егоработа в WordPress) 

  <script>
  jQuery( function() {
    function log( message ) {
      jQuery( "<div></div>" ).text( message ).prependTo( "#log" );
      jQuery( "#log" ).attr( "scrollTop", 0 );
    }

    jQuery.ajax({
      url: "https://teamazing.de/feeds/locationsfeed.xml",
      dataType: "xml",
      success: function( xmlResponse ) {
        var data = jQuery( "item", xmlResponse ).map(function() {
          return {
            value: jQuery( "name", this ).text(),
            id: jQuery( "type", this ).text(),
            image: jQuery("type", this ).text()
          };

        }).get();
        jQuery( "#birds" ).autocomplete({
          source: data,
          select: function (event, ui) {
            $( "#birds" ).val( ui.item.value );
          },
          minLength: 0
        }).data( "ui-autocomplete" )._renderItem = function( ul, item ) {  
           return $( "<li></li>" )  
               .data( "item.autocomplete", item.value )  
               .append( item.image + " - " + item.value )  
               .appendTo( ul );  
       }; 
      }
    });
  } );
  </script>

1 Ответ

0 голосов
/ 04 июля 2019

Это может быть связано только с CSS, а не с jQuery. Попробуйте добавить этот CSS для пользовательского интерфейса jQuery: 

.ui-autocomplete {
    z-index: 99999; /* adjust this value */
}

Это было найдено из другого ответа, который упоминает об этом и имеет другие решения: Событие выбора автозаполнения jQuery UI не работает с щелчком мыши

...