javascript - 输入时 KnockoutJS 按键事件的意外行为

标签 javascript html knockout.js data-binding

我在搜索类型的输入上绑定(bind)了一个事件,这是为了向服务器端触发搜索并在用户键入时填充列表。

那部分很好,我已经使用纯 JavaScript 建立了一个骨架示例,当需要集成到 knockout 中时,我遇到了一个奇怪的问题。

我的 HTML 中有标准绑定(bind):

<input data-bind="event:{keypress:ring}" type="text" />

对于这个例子,我的响铃功能将在按下按键时简单地记录一些内容:

ring: function (event) {
            this.triggered(this.triggered() + 1);
            var msg = "Keypress binding called " + this.triggered() + " time(s).";
                    console.log(msg);
                } 

这都是正常的,没有问题..

问题是输入值/字符串没有被更新。它只是保持空白,就好像我没有按任何东西一样。

我很好奇我是否缺少某种我应该做的默认转发?这是预期的行为吗?我觉得有点奇怪。

这里有一个工作示例:JSfiddle

当您在输入中键入内容时,除了我的 ring 功能之外,什么也没有发生。

最佳答案

您需要从事件处理函数返回 true,以允许对输入执行默认操作。

此处演示:http://jsfiddle.net/szcuyq13/1/

    ring: function (event) {
        this.triggered(this.triggered() + 1);
        var msg = "Keypress binding called " + this.triggered() + " time(s).";
        console.log(msg);
        return true;
    } 

换句话来说,这正是您所猜测的:您只需要添加一点内容即可确保“默认转发”按您的预期发生。默认情况下,KO 会阻止绑定(bind)事件处理程序中的默认操作,并且通过返回 true,您将请求完成该默认操作。此处的注释 3 标题下对此进行了描述:

http://knockoutjs.com/documentation/event-binding.html

该注释还解释了 KO 这样做的原因,当您将其与 anchor 和点击一起考虑时,这是有道理的。

关于javascript - 输入时 KnockoutJS 按键事件的意外行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30220892/

相关文章:

javascript - 内容内的颜色编码可编辑吗?

javascript - 当我单击 <Link> 时,React Router 4.1.1 不呈现

javascript - knockout.js 不对可观察数组进行排序

javascript - knockout JS : replace specific field value in multi dimentional array

react 中的 JavaScript

javascript - 无法读取 javascript 中错误的属性

javascript - 模态框不会显示

javascript - 一页上有很多 div

html - 使用 CSS 的 Bootstrap 3 Grid 中的垂直 DIV 对齐

javascript - "create"指定主 "create"时不使用嵌套对象的 KO 映射选项