<!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>
