javascript - 输入字段多次执行Javascript事件

标签 javascript jquery keypress keyup content-length

这里是 JavaScript 菜鸟。我试图为我的网络应用程序实现的 MFA 输入字段验证有点困难。

我不想让用户在输入字段中输入 MFA 代码后点击“提交”按钮,而是想在字段长度达到 6 个字符时简单地触发我的后端服务。我在很多网站上都看到过这种优雅的做法。

就我而言,当我单击字段外时,它会连续触发 lambda 函数 4 次。我不太明白为什么它会发射 4 次,而不是一次?

我的假设是因为我试图同时考虑按键、按键、模糊和更改?通过这样做,我试图考虑多种用户行为,例如:失去字段焦点、将选项卡移出字段或按“enter”键。

$("#login2fa").inputmask("9 9 9 9 9 9").on("keyup keypress blur change", function() {
    var $el = $(this);

    var code = $el.val().replace(/[^\d]/g, '');
    if (code.length === 6) {
        lambdas.userLoginMfaConfirm(session_token, code, handleConfirmResult);
    }
});

最佳答案

回答我自己的问题,感谢@camillo 的评论!

事实证明,拥有多个 .on 函数会多次运行调用。通过调整 on 函数以仅包含“keyup”,它按预期工作。

$("#login2fa").inputmask("9 9 9 9 9 9").on("keyup", function() {
    var $el = $(this);

    var code = $el.val().replace(/[^\d]/g, '');
    if (code.length === 6) {
        lambdas.userLoginMfaConfirm(session_token, code, handleConfirmResult);
    }
});

关于javascript - 输入字段多次执行Javascript事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66593449/

相关文章:

c# - 如何在 WPF/C# 中捕获不同语言环境键盘上的 '#' 字符?

javascript - 如何通过 jQuery 在按键事件期间获取 HTML 文本输入的新值?

javascript - 在 javascript 中包装长 SQL 语句的便捷方法

javascript - 如果在 jQuery 中选择了选项,则显示 div

javascript - 我的浏览器需要 JavaScript 才能运行

javascript - jQuery mobile、html5 手机链接用 javascript 代替

javascript - 同一父 div 中具有相同类的两个 div 显示不同

javascript - Selectize.js:静默添加项目时触发的 onItemAdd 事件

javascript - Bing map V8 GeoJson pin 上的点击事件

javascript - 如何检测浏览器中是否支持箭头键的按键?