代码改变世界

firefox和google中的alert()到底搞什么

2009-06-04 13:01  shaofeng  阅读(2614)  评论(36编辑  收藏  举报
1<input type="text" id="txtInfo" />

我们一个需求:在文本框txtInfo按下回车后,弹出框提示一个信息


我们代码如下实现

Code

这段代码没有问题,我们的要求达到了。

下面我们把这个放到表单中

在表单中增加一个submit按钮,来提交
最终代码如下

Code

这个时候我们在ie里正常执行,在firefox和google里会发现在执行
alert("您按了回车了哦");的时候页面会先刷新一下再执行这个代码
为什么会这样呢,我们先猜测它是先触发了submit按钮后再执行alert()方法


为了说明这个问题,我们再次修改代码如下

 

Code

 

然后我们在执行刚才的动作,这个时候我们发现它是先执行了alert("你触发了submit");
然后再执行了alert("您按了回车了哦");

然后我们把alert("您按了回车了哦");注销掉,就一切正常了,不会有这样的问题了

代码如下

Code

那对于这个为什么会这样的问题,我目前还不知道,只知道这些表象

希望大家能够给予我对这个疑问的答案,我能力有限,只能了解到这里了

说明:这里用的是jquery1.3.2版的框架(问题与框架无关,为了方便大家测试,在此说明用此框架)

 

-------------------------

这里多谢Genius Zhang的指点:1.1 Form 中。 submit 的快捷键是 enter,reset 的快捷键是 esc。
1.1.1 在 IE 中,按下enter 键后 却不会激发 submit 的 onclick 事件, 按下esc 键后 会激发 reset 的 onclick 事件
1.1.2 在 FF 中与 IE 正相反,按下enter 键后 会激发 submit 的 onclick 事件, 按下esc 键后 却不会激发 reset 的 onclick 事件
1.1.3 在 form 中,时间激发顺序是: submit 按钮的 onclick ==> form 的 onsubmit

解决方式:<input type="submit" onclick="return false;" style="display:none"/>
把这个放在页面的最前面