0

在我的 viewmodel 的 viewAttached(后 DOM 加载)中,我有以下内容:

viewAttached: function () {
            $('.auth-input').keydown(function (e) {
                debugger;
                var check = auth.showRegistering();
                var code = (e.keyCode ? e.keyCode : e.which);
                if (code == 13 && auth.showRegistering()) {
                    alert("trying!");
                    auth.register();
                }
                else if (code == 13 && auth.showRegistering() == false) {
                    auth.logIn();
                }
            });
        },

这适用于所有字段,除了隐藏在 if 语句后面的字段:

<input data-bind="value: email" class="span2 auth-input" type="text" placeholder="Email">
<input data-bind="value: password" class="span2 auth-input" type="password" placeholder="Password">
<!-- ko if: showRegistering -->
<input data-bind="value: passwordConfirm" class="span2 auth-input" type="password" placeholder="Password Confirm">
<!-- /ko -->

似乎 keydown 操作识别了前两个输入,因为它们在 DOM 加载时可见,但另一个字段最初不可见。

这是一个精简的小提琴来演示我正在尝试的内容:

http://jsfiddle.net/PTSkR/41/

有没有办法在第三个输入中捕捉按键?

4

2 回答 2

1

出现问题是因为敲除“if”绑定会阻止 passwordConfirm 输入在模型被绑定之前呈现。

您可以通过使用敲除来绑定 keydown 事件而不是使用 jquery 来解决此问题。

把它放在你的模型上:

OnKeyDown: function (data, e) {
    debugger;
    var check = auth.showRegistering();
    var code = (e.keyCode ? e.keyCode : e.which);
    if (code == 13 && auth.showRegistering()) {
        alert("trying!");
        auth.register();
    }
    else if (code == 13 && auth.showRegistering() == false) {
        auth.logIn();
    }
};

并像这样修改您的绑定:

<input data-bind="value: passwordConfirm, event: {keydown:OnKeyDown}" type="password" />
于 2013-05-01T23:14:55.933 回答
0

如果不确定 DOM 元素是否存在,可以使用事件委托。jQuery 使这对您来说非常容易:

$(document.body).on('keydown', '.auth-input', function (e) {
    var code = e.which;
    if (code == 13) {
        alert("trying!");
    }
});

请参阅此处的工作示例:http: //jsfiddle.net/PTSkR/45/

此外,按照jQuery 文档中的建议,使用 e.which 获取字符代码。

于 2013-05-01T23:13:49.613 回答