另一个jQuery自动完成问题

时间:2011-10-18 17:51:22

标签: javascript jquery

所以,我已经阅读了至少20-30个自动完成问题,所以我找不到任何解决方案。由于一些奇怪的原因,我一直得到值=未定义。这是我的代码。

//Cycles through each input and turns it into a person searcher.
$.each(settings.input, function() {
    var input = $(this);
    input.autocomplete({
        delay: 70,
        minLength: 2,
        source: function(req, add) {
            var val = input.val();

            $.post(VUI.SITE_URL + "scripts/autocomplete/_AutoComplete.php", {q: val, display_count: settings.displayCount, action: "user"}, function(data) {
                data = eval("(" + data + ")");

                if (data.length > 0) {
                    var results = new Array(data.length);
                    $.each(data, function(key, value) {
                        results[key] = {desc: value, value: value.firstname + " " + value.lastname};
                    });
                    add(results);
                } else {
                    add(["No results..."]);
                }
            });
        },
        select: function(event, ui) {
            alert(ui.item ? ("Selected: " + ui.item.value + " aka " + ui.item.id) : "Nothing selected, input was " + this.value);
        }
    }) // end auto complete.
    .data("autocomplete")._renderItem = function($ul, item) {
        var $li = $("<li></li>"),
            $inner = $("<div class='st-display side-content clearfix'style='padding-top:6px'></div>"),
            $a = $("<a></a>"),
            $img = $("<div class='image fl'></div>").html(ST.Image.getImage({
                uid: item.desc.uid,
                type: ST.ST_IMAGE_TYPE_THUMBNAIL_SMALL
            })),
            $content = $("<div class='content fl'></div>").html(
                item.desc.firstname + " " + item.desc.lastname + "<br/>" +
                "<span class='color:#979797;font-weight:bold'>" + item.desc.city + ", " + item.desc.state + "</span>"
            );

        $inner.append($img).append($content);
        $a.append($inner);
        $li.append($a);
        $ul.append($li); 

        return $ul;
    } // end _renderItem */

我试图让它非常直接。但它不会工作! (它的Facebook像汽车完成)。正确显示自动完成(项目在该点不等于未定义),但是当我突出显示它时,项目变为未定义,因此item.value(jquery.ui.1.8.13的第6347行)抛出异常!

有人看到问题吗?


这是有趣的事情......当我不使用数据(“自动完成”)._ renderItem(用于自定义完成)时,选择有效! ...那么为什么覆盖自定义渲染会导致问题呢?我甚至还没有退回UL。

1 个答案:

答案 0 :(得分:1)

您的代码中唯一不同于我所拥有的非常相似的工作版本的是我使用以下内容初始化$li

var $li = $( '<li></li>' ).data('item.autocomplete', item);

将数据附加到列表项,我认为自动完成插件用于在选择时获取值。

希望有所帮助