在输入type="text"中跟踪onchange的最佳方法?

根据我的经验，input type="text" onchange事件通常只发生在你离开(模糊)控件之后。

有办法迫使浏览器触发onchange每次文本字段内容的变化?如果不是，那么“手动”跟踪这种情况的最佳方法是什么?

使用onkey* events是不可靠的，因为您可以右键单击字段并选择粘贴，这将在没有任何键盘输入的情况下更改字段。

setTimeout是唯一的方法吗?丑:-)

当前回答

2018年到了，我是这么做的:

$(inputs).on('change keydown paste input propertychange click keyup blur',handler);

如果你能指出这种方法的缺陷，我会很感激。

其他回答

Javascript在这里是不可预测和有趣的。

Onchange只在模糊文本框时发生 Onkeyup & onkeypress并不总是发生在文本更改 Onkeydown发生在文本更改时(但不能跟踪鼠标点击的剪切和粘贴) Onpaste & oncut发生在键盘，甚至鼠标右键单击。

因此，要跟踪文本框中的变化，我们需要onkeydown, oncut和onpaste。在这些事件的回调中，如果你检查文本框的值，那么你不会得到更新的值，因为该值在回调后发生了变化。因此，解决方案是设置一个超时函数，其超时时间为50毫秒(或更少)，以跟踪更改。

这是一个肮脏的黑客，但据我研究，这是唯一的方法。

这里有一个例子。 http://jsfiddle.net/2BfGC/12/

您也可以使用按下键、按上键和按下键事件。

方法一:为输入添加事件监听器:

element.addEventListener("input", myFunction);

方法2:用JavaScript定义oninput属性:

element.oninput = function()
{
    myFunction();
};

方法3:用HTML定义oninput属性:

<input type="text" oninput="myFunction();">

2018年到了，我是这么做的:

$(inputs).on('change keydown paste input propertychange click keyup blur',handler);

如果你能指出这种方法的缺陷，我会很感激。

“输入”对我很有用。

var searchBar  = document.getElementById("searchBar");
searchBar.addEventListener("input", PredictSearch, false);

推荐文章