php - Jquery valはテキストボックスに新しい値を設定しません

Question

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>

Answer 1

解決

success 関数を次のように置き換えます。

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ただし、コールバック関数で設定されたフィールドで値が上書きされるため、期待される結果は表示されません。response これは のデフォルトの動作ですautocomplete。

さらに、selectイベントはui.itemアイテムの選択に正確に反応するため、未定義で呼び出されるべきではありません..."Nothing selected, input was " + this.value);とにかく代替手段に到達するべきではありません。

Answer 2

試す

$("#appendedInputButton").attr('value',message);