jQuery Autocomplete - 在选择之前不要填​​充文本输入（鼠标或输入）

Posted 2023-05-08

【中文标题】jQuery Autocomplete - 在选择之前不要填​​充文本输入（鼠标或输入）

【英文标题】：jQuery Autocomplete - don't fill text input until selected (mouse or enter)

【发布时间】：2019-07-08 21:27:04

【问题描述】：

我正在使用连接到数据库的 jQuery 自动完成功能。现在，如果您开始键入一个术语并将鼠标移到填充的列表上，那么在您单击列表项之前，带有原始术语的文本输入不会改变。

我希望键盘也能发生同样的事情。键入向下箭头时不要填写文本框。使用enter 或mouse click 同时填充文本框和隐藏ID

$(function() 
    function log( message ) 
        $(".userBookProjId").val(message);
        $(".userBookProjId").scrollTop( 0 );
    
    $( ".userBookProj" ).autocomplete(
        source: "userBookProj.php?userId=" + $('#userId').val(),
        minLength: 2,//search after two characters
        select: function( event, ui ) 

            log( ui.item ? ui.item.id : "");
        
    );
);

非常感谢任何帮助！

【参考方案1】：

您将希望使用focus 事件。

$(function() 
  function log( message ) 
    $(".userBookProjId").val(message);
    $(".userBookProjId").scrollTop( 0 );
  
  $( ".userBookProj" ).autocomplete(
    source: "userBookProj.php?userId=" + $('#userId').val(),
    minLength: 2,
    focus: function()
      return false;
    ,
    select: function( event, ui ) 
      log( ui.item ? ui.item.id : "");
    
  );
);

焦点（事件，用户界面）

类型：自动完成对焦

当焦点移动到一个项目（不是选择）时触发。默认操作是将文本字段的值替换为焦点项的值，但前提是事件由键盘交互触发。

取消此事件会阻止更新值，但不会阻止菜单项获得焦点。

查看更多：http://api.jqueryui.com/autocomplete/

希望对您有所帮助。