<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="auther" content="fq" /> <title>监听输入框值的即时变化 onpropertychange oninput</title> <script type="text/javascript"> function immediately() { var element = document.getElementById("mytext"); if ("v" == "v") { element.onpropertychange = webChange; } else { element.addEventListener("input", webChange, false); } function webChange() { if (element.value) { document.getElementById("test").innerHTML = element.value }; } } function addValue() { document.getElementById("mytext").value = 'dfdsafdsfsfsdfsdfdsf'; document.getElementById("mytext2").value = 'dfdsafdsfsfsdfsdfdsf'; } </script> </head> <body> <input type="button" id="txts" value="点击加载值!" onclick="addValue();" /> 直接写在页面中的示例： <input type="text" id="mytext2" name="textfield" oninput="document.getElementById('webtest').innerHTML=this.value;" onpropertychange="document.getElementById('webtest').innerHTML=this.value;" /> <div>您输入的值为：<span id="webtest">还未输入</span></div> <br /> <br /> <br /> <br /> <br /> <input type="text" id="mytext3" name="textfield" oninput="document.getElementById('webtest').innerHTML=this.value;" onpropertychange="document.getElementById('webtest').innerHTML=this.value;" /> <div>您输入的值为：<span id="webtest">还未输入</span></div> <br /> <br /> <br /> <br /> <br /> 写在JS中的示例： <input type="text" name="textfield" id="mytext" /> <div>您输入的值为：<span id="test">还未输入</span></div> <script type="text/javascript"> immediately(); </script> <script type="text/javascript"> /* function fn() { console.log(this.a); } var obj = { a: 2, fn: fn }; var bar = obj.fn; var a = "全局"; bar(); <!----> var obj = { a: 2 }; fn.call(obj); var obj = { a: 3 } fn.apply(obj); var a = 10; fn.call(); function Fun(a) { this.a = a; } var bar = new Fun(2); console.log(bar.a); function fn1() { var b = 2; this.fn2(); //以为this引用的是fn1的词法作用域 } function fn2() { console.log(this.b); } fn1(); //ReferenceError*/ </script> <!-- <script type="text/javascript" src="socket.io.js"></script> --> </body> </html>