如何在用JavaScript输入后强制执行函数

Question

我正在制作一个小型计算器（仅用于JavaScript学习），我有两个用于分数计算的输入字段：

1. 字段：分子
2. Field：denominator

按钮“Calculate fraction”，当用户点击它时执行函数myFraction(numerator,denominator)。

没有按钮可以做同样的事情吗？ 我的意思是JavaScript应该认识到某人正在输入，然后自动计算分数。

Answer 1

您可以挂钩onkeyup或onkeydown事件处理程序并调用您的函数：

<input type="text" id="numerator" onkeyup="myFraction()" />
<input type="text" id="denominator" onkeyup="myFraction()" />

你需要获取myFraction（）函数中文本框的值，并在将分数值输出到屏幕之前检查它们是否为空白。

function myFraction() {
    if(document.getElementById("numerator").value != "" &&
       document.getElementById("denominator").value != "") {
        ...do calculations
    }
}

Answer 2

当然，我认为您需要onChange()（正在编辑文本）或onBlur()（当文本框失去焦点时）。请参阅difference here。

自从你学习以来，jQuery可以帮助解决一些细微差别 - 包括这里。

Answer 3

Javascript是事件驱动的，所以是的，您可以在使用keyup键入事件或用户从文本框控件移开时捕获事件。

您可以在文本框离开后查看文本框的长度，验证它们输入的内容，然后运行计算。

我经常在用户离开文本框后使用模糊捕捉。我通常使用Onchange进行选择。