<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" "http://www.wapforum.org/DTD/wml_1.1.xml">
<wml>
<head><meta forua="true" http-equiv="Cache-Control" content="max-age=0" /></head>
<card title="js使用onpropertychange,oninput事件解决onchange事件的不足" id="card1">
<p> 游客</p><p>
标题:js使用onpropertychange,oninput事件解决onchange事件的不足<br/>
正文:<br/>
用onpropertychange,oninput事件解决onchange事件的不足，需要的朋友可以参考下。onchange在用于文本框输入框时,有一个明显的不足. 事件不会随着文字的输入而触发,而是等到文本框失去焦点(onblur)时才会触发. 也就是没有即时性!在IE下,可以用onpropertychange来代替onchange事件,当文本框有任何变化时,能立即触发此事件.这样一来问题就解决了.那其他浏览器呢,onpropertychange可是IE的专利. 接下来就是oninput事件了.但是oninput有个诡异,必须用addEventListener的方式来绑定事件.否则无效.好了, 以下是演示例子, 主流浏览器都没问题:&amp;lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&amp;gt; &amp;lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=gb2312&quot; /&amp;gt; &amp;lt;title&amp;gt;on用onpropertychange,oninput事件解决onchange事件的不足 by koyoz.com&amp;lt;/title&amp;gt; &amp;lt;style type=&quot;text/css&quot;&amp;gt; *{font-size:14px;font-family:’Comic Sans MS’, Verdana} body {margin-left:20px} &amp;lt;/style&amp;gt; &amp;lt;/head&amp;gt; &amp;lt;body&amp;gt; &amp;lt;p&amp;gt;使用onchange事件: &amp;lt;/p&amp;gt; &amp;lt;input type=&quot;text&quot; id=&quot;txt1&quot; /&amp;gt; &amp;lt;p&amp;gt;使用onpropertychange/oninput事件: &amp;lt;/p&amp;gt; &amp;lt;input type=&quot;text&quot; id=&quot;txt2&quot; /&amp;gt; &amp;lt;p&amp;gt;结果:&amp;lt<br/><a href="http://camnpr.com/wap.asp?mode=WAP&amp;act=View&amp;id=392&amp;Page=1">[&lt;&lt;]</a><a href="http://camnpr.com/wap.asp?mode=WAP&amp;act=View&amp;id=392&amp;Page=1">[[1]]</a><a href="http://camnpr.com/wap.asp?mode=WAP&amp;act=View&amp;id=392&amp;Page=2">[2]</a><a href="http://camnpr.com/wap.asp?mode=WAP&amp;act=View&amp;id=392&amp;Page=2">[&gt;&gt;]</a><br/>
<br/>
<a href="wap.asp?act=Com&amp;id=392">查看评论(0)</a><br/>
<a href="wap.asp?act=AddCom&amp;inpId=392">发表评论</a><br/><br/>

<br/>

<br/>
<a href="http://camnpr.com/wap.asp">首页</a>
</p>
</card>
</wml>