如何在knockoutjs中单击输入字段并触发事件并进行测试？

Question

我想要实现的是，当用户点击输入字段时，我希望搜索栏位于页面顶部。我使用hasFocus但它只在我再次点击搜索栏后第一次加载页面时才有效。

<div class=".home-search-panel">
    <input type="search" data-bind="hasFocus: searchInputFocus()" name="q" placeholder="@Global.SearchPlaceholderCopy" value="@Request.QueryString["q"]" maxlength="150" class="input-product-search" autocomplete="off" />
</div>

这是我的淘汰赛代码

var searchInputFocus = function () {
    document.body.scrollTop = zepto('.home-search-panel').offset().top;
};

我认为这段代码使用的是DOM操作，如果不使用jquery-jasmine如何以淘汰的方式做这样的事情就更难测试，这样我就可以正确地测试它了吗？

Answer 1

我的想法......

1. 你应该在searchInputFocus（）之后删除（），它应该只是searchInputFocus
2. hasFocus绑定需要返回true或false。如果控件具有焦点，则hasFocus不检查，如果绑定参数的计算结果为true，则使控件具有焦点。因此，如果searchInputFocus返回true，则knockout将设置输入框以获得焦点。 documentation中有一个很好解释的例子，我真的无法做得更好。 ： - ）
3. 听起来你真正想要的是事件绑定：data-bind="event: { onfocus: searchInputFocus}"在这种情况下，当输入框具有焦点时，将调用searchInputFocus函数。
4. 评论中建议的点击绑定也应该有效。它可能不适合你，因为你需要删除searchInputFocus之后的（），如上面第1点所述。虽然如果有人选中该字段，点击不会激发。

希望有所帮助。