jquery-ui - 可以自动跳出jQuery UI自动完成功能的帮助

Question

我已经编写了一些jQuery代码以在输入字段上启用自动完成功能。

我遇到了两个似乎无法解决的问题。


跳离该字段将不会填充输入。我需要的是，如果没有选择任何内容（单击或通过上/下选择），则首先建议填充该字段，或者在该字段中填充突出显示的项目。 （注意：突出显示是通过向上/向下箭头完成的）
当使用向上/向下箭头时，我需要输入来显示“ LABEL”而不是“ VALUE”。当前按下向上/向下将在输入中填充VALUE。


任何建议将不胜感激。

这是我的JSBIN测试场。
http://jsbin.com/iyedo3/2

注意：<input id="dummy" />字段仅用于为您提供一些“制表”到的内容。如果删除，则帮助区域会扩展。

Answer 1

我想我已经知道了。使用jQuery AutoComplete助手

$(function () {
    $(label_element).autocomplete({
        source: json_string,
        selectFirst: true,
        focus: function (event, ui) {
            return false;
        },
        select: function (event, ui) {
            $(value_element).val(ui.item.value);
            $(label_element).val(ui.item.label);
            return false;
        }
    });
});

和以下选择第一个脚本

(function ($) {

    $(".ui-autocomplete-input").live("autocompleteopen", function () {
        var autocomplete = $(this).data("autocomplete"),
        menu = autocomplete.menu;

        if (!autocomplete.options.selectFirst) {
            return;
        }

        menu.activate($.Event({ type: "mouseenter" }), menu.element.children().first());
    });

} (jQuery));

现在，我需要添加自动完成功能的任何地方，都可以使用它。

<script type="text/javascript">
        var json_string = // My Autocomplete JSON string.
        var label_element = "#RegionName";
        var value_element = "#RegionID";
</script>