JQuery автозаполнение с изображениями

Question

Я хочу реализовать функцию автозаполнения с изображениями на моем сайте.

Я хотел бы использовать плагин автозаполнения jQuery.

Я посмотрел их пример кода.

Может кто-нибудь объяснить мне, что означает приведенный ниже код в событии $ (document) .ready ():

$("#imageSearch").autocomplete("images.php", {
  width: 320,
  max: 4,
  highlight: false,
  scroll: true,
  scrollHeight: 300,
  formatItem: function(data, i, n, value) {
    return "<img src='images/" + value + "'/> " + value.split(".")[0];
  },
  formatResult: function(data, value) {
    return value.split(".")[0];
  }
});

Мое конечное требование - когда я набираю несколько букв в текстовом поле, я хочу, чтобы в опциях было изображение, связанное с ним.

Answer 1

Используйте это для справки: http://api.jqueryui.com/autocomplete/

---

$("#imageSearch").autocomplete("images.php", {

Применение автозаполнения подключением ко всем полям #imageSearch. Первый параметр, я думаю, это страница, которая генерирует ответ на основе введенного (images.php);

        width: 320,

Ширина раскрывающегося списка

        max: 4,

Максимум предложений

        highlight: false,

Выделите true / false

        scroll: true,

Полоса прокрутки, также называемый выпадающим списком, или просто длинный div под

        scrollHeight: 300,

Высота выпадающего списка автозаполнения.

        formatItem: function(data, i, n, value) {
            return "<img src='images/" + value + "'/> " + value.split(".")[0];
        },

Как отформатировать ответ, полученный от images.php .

        formatResult: function(data, value) {
             return value.split(".")[0];
        }

Как вернуть значение, если пользователь выбирает один из вариантов.

});

Закрывающие скобки: p

Answer 2

Это относится к JQuery Autocomplete PLUGIN, такой опции, как formatItem и formatValue, нет в фактическом автозаполнении Jquery UI.

Я предлагаю людям прочитать это http://www.learningjquery.com/2010/06/autocomplete-migration-guide, в котором объясняется, как перейти со старой версии плагина на официальный виджет пользовательского интерфейса.

Чтобы получить автозаполнение при работе с изображением в списке предложений, вы должны прочитать эту ветку: http://forum.jquery.com/topic/using-html-in-autocomplete