html文本输入onchange事件

时间:2011-05-29 17:47:43

标签: javascript html textbox

有没有办法实现文本更改事件来检测HTML输入文本字段上的文本更改?
可以使用键事件(按键等)模拟这些事件,但是,它确实不具有高性能和难度,有更好的方法吗?

5 个答案:

答案 0 :(得分:33)

onChange不会开火直到你以后失去焦点。如果您想对所有种类的瞬时变化非常严格,请使用:

<input
   type       = "text" 
   onchange   = "myHandler();"
   onkeypress = "this.onchange();"
   onpaste    = "this.onchange();"
   oninput    = "this.onchange();"
/>

答案 1 :(得分:31)

当我做这样的事情时,我使用onKeyUp事件。

<script type="text/javascript">
 function bar() {
      //do stuff
 }
<input type="text" name="foo" onKeyUp="return bar()" />

但如果您不想使用HTML事件,可以尝试使用jQuerys .change()方法

$('.target').change(function() {
   //do stuff
});

在这个例子中,输入必须有一个类“target”

如果你想要在他们的文本被更改并且你需要他们的数据时你想要做同样的事情的多个文本框,那么你可以这样做:

$('.target').change(function(event) {
   //do stuff with the "event" object as the object that called the method
)};

对于使用相同类的多个文本框,您可以使用相同的代码,而无需重写任何代码。

答案 2 :(得分:5)

除非我误解你,否则你可以使用onChange属性:

<input type="text" onChange="return bar()">

注意:在FF 3(至少)中,直到某些用户通过单击远离元素,单击输入或其他来确认它们已被更改,才会调用此方法。

答案 3 :(得分:1)

我用这一行来监听来自javascript的输入事件。
这很有用,因为它侦听文本更改和文本粘贴事件。

myElement.addEventListener('input', e => { myEvent() });

答案 4 :(得分:1)

使用 oninput 事件

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