代码之家  ›  专栏  ›  技术社区  ›  rapadura

jquery用户界面自动完成功能在输入时不选择

  •  8
  • rapadura  · 技术社区  · 15 年前

    我已经使用jquery用户界面自动完成了一个输入框,并从所选项目中设置了一个隐藏值。

    这是我用的

     select: function(event, ui) { ...$("#myDiv").val(ui.item.value)... } 
    

    选项(现在可能是错误的,没有现成的代码,但直到我提出问题…)

    当用鼠标从菜单中选择一个项目时,它会起作用,但是如果我只输入一些文本并用Enter键选择一个项目-它不做任何事情,就好像自动完成功能根本不运行选择。但是,从框中选择会触发选择。

    我使用了焦点和更改:也更新了我想要的字段,但我认为这太过分了,如果真的需要指定所有焦点、更改和选择,只是为了确保用户从列表中选择一个项目,它将实际被选中。

    谢谢您。

    Rofly:我使用的是jquery ui autocomplete,它有你提供的代码,但看起来像这样(从jquery.ui.autocomplete.js)

    
    case keyCode.ENTER:
                    case keyCode.NUMPAD_ENTER:
                        // when menu is open or has focus
                        if ( self.menu.active ) {
                            event.preventDefault();
                        }
                        //passthrough - ENTER and TAB both select the current element
                    case keyCode.TAB:
                        if ( !self.menu.active ) {
                            return;
                        }
                        self.menu.select( event );
                        break;
    

    这看起来很花哨,所以我不确定它是否因为这个而失败。

    我的代码是这样的(包装在document.read()中)

    $("#someDiv").attr("autocomplete", 'off');
    $("#someDiv").autocomplete({
    source: function(request, response) {
    if ( request.term in cache ) {
    response( cache[ request.term ] );
    return;
    }
    $.ajax({
    url: "giveMeJSON.jsp",
    dataType: "json",
    data: request,
    success: function( data ) {
    cache[ request.term ] = data;
    response( data );
    }
    })},
    minLength: 1,
    delay: 300,
    select: function(event, ui) {
    $("#someDiv").val(ui.item.label);
    $("#hiddenDiv").val(ui.item.value);
    }
    });

    所以,问题是,当用户用鼠标从菜单中选择时,以及在字段外选择时(keyup,keydown选择,然后tab out,有效),这是有效的,但是keyup,keydown选择它,然后回车,什么都不会发生!

    3 回复  |  直到 9 年前
        1
  •  6
  •   JeffSea    14 年前

    类似的实例也适用于jquery 1.4.2和jquery ui 1.8.7。一个警告是,Enter仅在从列表中选择项目时才起作用。如果要创建不存在的新条目,则按Enter不会触发选择或更改事件。我必须绑定一个单独的事件处理程序才能使该情况正常运行。

        2
  •  2
  •   Community CDub    8 年前

    这对我很有用,我在自动完成后提交表单。

        $("input#searchbox").autocomplete({
      source: autocomplete,
      select: function(event, ui) {  }
        $("input#searchbox").val(ui.item.value);
        $("#searchform").submit();
      }
    })
    

    Search on Click with Jquery's Autocomplete

        3
  •  1
  •   Community CDub    8 年前

    有这个参数吗?设置
    自动聚焦:真

    请参阅此处的答案: https://stackoverflow.com/a/9243511/74585