javascript 为何浏览器加载就触发了网页的input的onchange事件,而后概不触发。新人请多多指教

理论效果:通过t2(id)的onchange事件,来让t3.value=t1.value-t2.value
<body>
<p>
<input type="text" id="t1" value="0" />
-
<input type="text" id="t2" value="0" />
=
<input type="text" id="t3" />
</p>

</body>
<script type="text/javascript">
//声明一个对象,让对象的属性来保留所有;
var lab3 = {};
//对象里的$ 函数来获得id;
lab3.$ = function(id) {
return document.getElementById(id);
}
//获得id三个input的id
lab3.t1 = lab3.$("t1");
lab3.t2 = lab3.$("t2");
lab3.t3 = lab3.$("t3");
//先设置两个check的值,后面设置为真的时候相减
lab3.check = false;
lab3.check1 = false;

//当t2(第二个input)发生改变的时候才会执行result函数;
//lab3.t2.onchange = result();
//一开始我以上对象的属性的方法不能但是我错了。。。
document.getElementById("t2").onchange = result();
function result() {
var temp1=0;
var temp2=0;
//注意这里的check函数不是lab3.check;
lab3.check = check(lab3.t1.value);
lab3.check1 = check(lab3.t2.value);
//如以上为真则执行
if (lab3.check && lab3.check1) {
temp1 = parseFloat(lab3.t1.value);
temp2 = parseFloat(lab3.t2.value);
lab3.t3.value = (temp1 - temp2).toString();
return true;
}
//用来检测用的。。。
alert("dfdf");
//如果都没有则函数默认设置t3的value为0
lab3.t3.value = "0";
}
function check(v) {
alert(v);
//javascript的正则表达式 下含义为:0-9当中的数出现至少一次无上限
var regex = /[0-9]+/;
//用正则表达式的test方法匹配v如果匹配到了则返回true;
if (regex.test(v)) {
return true;
}
return false;
}
</script>
不明真相:
这是在火狐里的,当浏览器第一次执行的时候,就自动执行了onchange事件,而事实是我的根本没有动t2里的值!
奇怪的事发生了,就是当我把里面的值改变之后f5刷新之后,可以求得,改变之后的值。

而在IE里就没那么好了改变了f5刷新也没有用!

还有一个奇怪的就是当我在IE8环境下,运行这段代码的时候会出现一个警告!具体就是:**未实现
,是属性还是什么的忘记了。

是我的逻辑错误吗?还是代码那里错了,请指正!

<p>
<input type="text" id=t1 value="0" />
-
<input type="text" id=t2 value="0" onchange="ff()" />
=
<input type="text" id=t3 />
</p>
</body>
<script>
function ff(){
t3.value=t1.value-t2.value
}
</script>

你写了一大堆,到底要干什么呀?

追问

通过t2(id)的onchange事件,来让t3.value=t1.value-t2.value

而不是简单的运行就这样子。
function ff(){
t3.value=t1.value-t2.value
}
而不是自己要算啥还要修改代码。。
看提问的开头我就说了的,要的每次的onchange!至于写那么多纯粹是新手练手!可能你没看懂!
至于我要干嘛,代码的每一条都有我的注释!如不懂请认真看一下!

追答

好吧,那按照你的逻辑走一遍,

document.getElementById("t2").onchange = result();

赋值有问题,你这样写有问题,result 是个方法,返回值是 true 或者false 等等,你要把这个返回值赋给 onchange 事件么?
显然不是
应该是
document.getElementById("t2").onchange = result;
将result 这个对象给 onchange对象。也就是让onchange这个对象指向你的result对象。

IE 和 火狐在这里有不同,IE会认为你还没有注册 result 所以报 尚未实现。

而火狐会真的 去执行(他倒是可以在后面找到这个result),但是按照你的写法要将result()的结果返回,所以会真的去执行这个结果,但是执行结果之后,你的onchange 方法变成了一个 true(false),也就没办法再次执行了。

还要解释一下,IE中 不能绑定onchange为result(),找不到
但是为什么能注册 onchange为result 就能找到呢。result 的定义在 这个绑定的后面呀。
实际上,在绑定的时候 没有将result 的实现绑定样,而是讲一个空的内存地址帮过来了,不过这个空地址有名字为 result,当你注册 result 时才将这个空地址的内容填上了你要的内容。

追问

嗯是可行的!
但是按您的说法,那这样如何?
document.getElementById("t2").onchange= result(lab3.t2);
function result(l) {
alert(l);
}
其他省略,不要返回值,在if后加else。我的理解是当每次onchange事件了,立马执行函数result并alert。但是事实是还是不行

追答

你还是没看懂我说的

你这样做,就会在 绑定的时候 去运行 result ,结果导致将 某个东西绑定到onchange上

因为没有返回值,浏览器会认为绑定失败,这个时候你 

alert(document.getElementById("t2").onchange)

IE会报尚未实现。火狐估计会null(没装火狐这个烂东西,只能估计)

你要是想真的每次触发onchange 都 alert()

要这样

document.getElementById("t2").onchange = result(lab3.t2);
function result(I) {
    return function (){
        alert(I.onchange)
        }
}

尝试这个写法可能对你的理解有帮助……,其实也没必要多纠结了,没人这样绑定的……

追问

真心感谢!

追答

能帮到你就好了呵呵,再接再厉

温馨提示:内容为网友见解,仅供参考
无其他回答
相似回答