jQuery UI 自动完成

Question

我正在使用 jQuery UI 的自动完成插件，一切都很好，除了当用户单击他们想要的值时，我分配给“select:”方法的函数在字段值更改之前触发。 因此，如果我在输入字段中键入“Foo”，然后单击“Foo Bar”的自动完成匹配，该函数会将值检测为键入的值（在本例中为“Foo”），而不是从自动完成中选择的值列表。 一旦函数触发（在这种情况下，我只有一个带有this.value的警告框弹出），输入字段的值将设置为通过自动完成列表选择的值。 如果用户使用键盘（箭头键->tab）选择选项，则不会出现此问题，仅当使用鼠标时。

  $(function()
  {
    var aEmps = 
    [
<?php
echo $sEmps;
?>    
    ];

    $("#slast").bind( "keydown", function( event ) {
      if ( event.keyCode === $.ui.keyCode.TAB &&
          $( this ).data( "autocomplete" ).menu.active ) 
          { event.preventDefault(); }
    })
    .autocomplete({
      source: aEmps,
      select: function(event, ui)
      {
        var aName = $(this).val();
        alert(aName);
      }
    })
  });

由于大多数用户将使用他们的鼠标与此交互，因此我必须找到一种方法来在触发“选择：”功能之前获取设置的值。 我相信我可以通过在自动完成之前向语句添加条件来适应这一点，但我需要一些帮助来找到正确的语法。

Answer 1

综观文档，它看起来像作为选择正在更新被触发的选择情况下，选择更新而不是之后。 尝试使用change事件而不是select ，看看是否能解决您的问题。

Answer 2

在尝试了多种方法后，我发现通过简单地将回调函数绑定到关闭事件，效果非常好。 我添加了一些错误处理来捕获未从列表中选择的值，然后我就开始运行了！

这是更新后的代码：

  $(function()
  {
    var aEmps = 
    [
<?php
echo $sEmps;
?>    
    ];

    $("#slast").bind( "keydown", function( event ) {
      if ( event.keyCode === $.ui.keyCode.TAB &&
          $( this ).data( "autocomplete" ).menu.active ) 
          { event.preventDefault();}
    })
    .autocomplete({
      source: aEmps,
      close: function(event, ui)
      {
        alert(this.value);
      }      
    })
  });