【问题标题】:JQuery AutoComplete, manually select first searched item and bind click [duplicate]JQuery AutoComplete,手动选择第一个搜索的项目并绑定点击[重复]
【发布时间】:2012-11-06 00:32:12
【问题描述】:

我想在自动完成中手动选择一个项目并在给定值的情况下单击它。

以下代码:

autocompleteitem.autocomplete("option", "autoFocus", true).autocomplete("search", autocompleteitem.val());

autocompleteitem 是一个输入对象,它包含我要搜索的值。现在这段代码成功地从下拉列表中选择了第一个项目,但它没有点击它。我不想自己单击它,我希望它以某种方式在该代码中发生。

我尝试在上面的代码中添加以下内容,但没有成功:

   .click(), .select(), .trigger('select'), .find('a').click(), .change()

有什么办法可以做到吗?

谢谢

请人帮忙

【问题讨论】:

  • 你是说如果搜索值是一个特定的值然后让代码点击第一项?
  • 您使用的是哪个自动完成功能?????
  • 阿明是的,这就是我想要做的。 JQuery 自动完成
  • im 使用 JQuery ui-autocomplete

标签: javascript jquery jquery-autocomplete jquery-ui-autocomplete


【解决方案1】:

如果您查看 jQuery 团队在他们的 unit tests 中为自动完成所做的事情,他们会使用类似于以下代码的内容:

    var downKeyEvent = $.Event("keydown");
    downKeyEvent.keyCode = $.ui.keyCode.DOWN;  // event for pressing "down" key

    var enterKeyEvent = $.Event("keydown");
    enterKeyEvent.keyCode = $.ui.keyCode.ENTER;  // event for pressing "enter" key

    $("#autoComplete").val("item"); // enter text to trigger autocomplete
    $("#autoComplete").trigger(downKeyEvent);  // First downkey invokes search
    $("#autoComplete").trigger(downKeyEvent);  // Second downkey highlights first item
    $("#autoComplete").trigger(enterKeyEvent); // Enter key selects highlighted item 

这个plunk 表明它工作正常

【讨论】:

  • 我想指出我使用的是组合框 jquery 插件(它使用自动完成功能),它要求我在触发 ENTER 之前触发两次 DOWN 键
  • 在关于这个主题的几个问题/答案集中,这是唯一对我有用的。谢谢!
  • 我还发现有必要按两次 DOWN 键,然后按 ENTER。
  • 回车键需要被触发两次的原因是在按下按键后 UI 需要时间来更新。 Javascript 和 UI 更新不能同时运行。因此,您需要使用 setTimeout() 函数引入时间延迟。
  • 我相信你可以用0ms的延迟做到这一点。我经常在下划线中使用 defer 函数,只是为了让未来的维护者更清楚意图。 underscorejs.org/#defer
【解决方案2】:

看看这个jqFAQ.com 主题,这将帮助您以编程方式选择值的第一个匹配选项并将其设置到自动完成文本框中。还有一些其他与自动完成相关的常见问题解答,我认为这可能对您有用。

【讨论】:

  • 此链接不再有效。
猜你喜欢
  • 2016-09-08
  • 1970-01-01
  • 1970-01-01
  • 2018-08-05
  • 2019-07-16
  • 2011-12-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多