Firefox中OnKeyDown/OnKeyPress和Form的关系

时间：2010-08-30 来源：0417

需求陈述
很简单，页面中有如下元素，Form表单和文本框，当用户在文本框内回车时判断文本框是否有内容，然后选择性的给出提示。

问题描述
1.在FF中OnKeyDown事件会触发Form提交，而在IE中则不触发。
2.在FF和IE中OnKeyPress事件表现正常。
2.页面中去掉Form表单，表现正常。

测试代码

<div>
    <form name="form1" method="post" action="http://0417.cnblogs.com">
        该文本框为<strong>OnKeyPress</strong>测试
        <br />
        <input type="text" id="txtKey" onkeypress="if(KeyCode(event) == 13) return Search();" />
    </form>
    
    <br />
    
    <form name="form2" method="post" action="http://0417.cnblogs.com">
        该文本框为<strong>OnKeyDown</strong>测试
        <br />
        <input type="text" id="txtKey2" onkeydown="if(KeyCode(event) == 13) return Search2();" />
    </form>

    <script language="javascript" type="text/javascript">
        function Search() {
            var key = $("#txtKey").val();

            if (key == "") {
                alert("OnKeyPress 触发");
            }
            else {
                window.location = "http://www.google.com";
            }

            return false;
        }
        
        function Search2() {
            var key = $("#txtKey2").val();

            if (key == "") {
                alert("OnKeyDown 触发");
            }
            else {
                window.location = "http://www.google.com";
            }

            return false;
        }

        function KeyCode(e) {
            if ($.browser.msie) {
                return e.keyCode;
            }
            else {
                return e.which;
            }
        }
    </script>
</div>

该文本框为OnKeyPress测试，回车后弹出提示对话框，停留在当前页。

该文本框为OnKeyDown测试，回车后，一边跳转到本博首页一边弹出对话框，谁先谁后？

测试响应顺序

<input type="text" id="txtOrder"/><br/>
<script language="javascript" type="text/javascript">
var txt = document.getElementById("txtOrder");
txt.onkeypress=function(){
    alert("OnKeyPress 触发");
}
txt.onkeydown=function(){
    alert("OnKeyDown 触发");
}
</script>

将焦点定位到文本框中，然后按键盘

小结以及问题
onkeypress：事件会在键盘按键被按下并释放一个键时发生。
onkeydown：事件会在用户按下一个键盘按键时发生。
onkeyup：事件会在键盘按键被松开时发生。

在FF中onkeypress首先被触发，接着才是onkeydown被触发，然后再触发一遍onkeypress事件。
而IE则是先onkeydown接着onkeypree被触发。

问题是：为什么在一个有Form表单的页面使用onkeydown会出现提交的操作？