jQuery的自动完成与图片 [英] jQuery autocomplete with images

问题描述

我要实现我的网站与图像的自动完成功能。

I want to implement an autocomplete feature with images in my website.

我想用jQuery的自动完成插件。

I would like to use the jQuery autocomplete plugin.

我看了一下他们的样品code。

I had a look at their sample code.

任何人能解释我什么是低于code指的$（document）。就绪（）事件：

Can anyone explain me what the below code means in $(document).ready() event:

$("#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];
  }
});

我的最终要求是，当我在文本框中键入一些字母，我想要的选项来与之相关的图像。

My ultimate requirement is when I type some letters in the text box, I want the options to come with an image associated with it.

推荐答案

使用此以供参考：的http：// api.jqueryui.com/autocomplete/

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

应用pluging自动完成所有领域#imageSearch。第一个参数我想这是基于上输入的内容（images.php）生成响应页面;

Apply pluging autocomplete to all fields #imageSearch. First parameter I guess it the page that generates the response based on what is entered (images.php);

        width: 320,

在下拉的宽度

        max: 4,

最大建议

        highlight: false,

高亮真/假

        scroll: true,

滚动条又名下拉类型的列表，或者只是一个长期的div下。

Scroll bar aka drop-down kind of list, or just a long div under.

        scrollHeight: 300,

自动完成下拉的高度。

Height of the auto complete drop down.

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

如何从格式化的 images.php 的返回的响应。

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

如何返回的值，如果用户选择的选择之一。

How to return the value, if the user selects one of the choices.

});

右括号：P

这篇关于jQuery的自动完成与图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！