0

我使用 jqueryUI 自动完成来搜索地理名称,但我无法为我的文本框设置值,这是我的代码:

<script>
    $(function () {
        function log(message) {
            $("#appendedInputButton").val(message);
        }
        $("#appendedInputButton").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: "http://ws.geonames.org/searchJSON",
                    dataType: "jsonp",
                    data: {
                        featureClass: "P",
                        style: "full",
                        maxRows: 12,
                        name_startsWith: request.term
                    },
                    success: function (data) {
                        response($.map(data.geonames, function (item) {
                            return {
                                label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
                                value: item.name
                            }
                        }));
                    }
                });
            },
            minLength: 1,
            select: function (event, ui) {
                log(ui.item ?
                    "Selected: " + ui.item.label :
                    "Nothing selected, input was " + this.value);
            },
            open: function () {
                $(this).removeClass("ui-corner-all").addClass("ui-corner-top");
            },
            close: function () {
                $(this).removeClass("ui-corner-top").addClass("ui-corner-all");
            }
        });
    });
</script>     

我的 HTML 是:

<div class="input-append">
    <form role="search" method="get" id="searchform" action="http://sushiant.com/">
        <button class="btn" type="submit" id="searchsubmit">جستجو</button>
        <input class="span2" name="appendedInputButton" id="appendedInputButton" size="16" type="text" style="width: 300px;">
    </form>
</div>
4

2 回答 2

1

解决方案

将成功函数替换为以下内容:

success: function (data) {
    response($.map(data.geonames, function (item) {
        var text = item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName;
        return {
            label: text,
            value: text
        }
    }));
}

我猜这"Selected: "部分只是为了调试目的,所以基本上你要做的就是将两者都设置labelvalue相同的字符串。

解释

调用val()工作非常好。但是,您看不到预期的结果,因为该值已被 回调函数中value设置的字段覆盖,这是.responseautocomplete

此外,select永远不应该使用ui.itemundefined 调用该事件,因为它会精确地对项目的选择做出反应......所以"Nothing selected, input was " + this.value);无论如何都不应该达到替代方案。

于 2013-08-08T14:07:02.750 回答
-3

尝试

$("#appendedInputButton").attr('value',message);
于 2013-02-13T10:12:23.790 回答