Question

我有一个firstName和一个lastName输入，我将其隐藏并用单个fullName输入框替换。然后，我在动态创建的输入上使用JqueryUI自动完成功能，并且工作正常。当我尝试为此编写单元测试并动态添加一些输入并触发“ keydown”事件时，不会显示带有自动完成结果的框（我想断言我在测试中获得了想要的结果）。如果我在输入中手动键入“ s”，结果显示就很好。我有一个JSFiddle可以说明我的问题。

HTML：

<input id="firstName">
<input id="lastName">

jQuery：

// add the single input
$('#firstName').before('<input id="fullName">');
// remove the original first and last name fields
$('#firstName, #lastName').hide();
// call autocomplete on the dynamically created input
$("#fullName").autocomplete({
  source: ["ActionScript", "AppleScript", "ASP", "Basic", "ColdFusion", "Haskell", "JavsScript", "Lisp", "Scala", "Scheme"]
});

// ** start unit test **

// auto populate the dynamic input
$('#fullName').val('sc');
// force a keypress to show the autocomplete options
$('#fullName').trigger('keypress');

Answer 1

替换

$('#fullName').trigger('keypress');

使用

$('#fullName').autocomplete('search');

更新

OP宁愿不使用小部件的API，并且诸如keydown和keypress之类的常见事件取决于event.keyCode，而调用trigger时则不存在。 / p>

有趣的是，input事件不会抑制按键。因此，这可能是OP单元测试的理想选择。

$('#fullName').trigger('input')

如何在动态创建的元素上触发按键事件

1 个答案: