您的位置：首页 > Web前端 > HTML

[HTML] 关于表单提交的诡异现象

2010-01-07 15:35 211 查看
首先，我们来看下如下的代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<FORM METHOD=POST ACTION="http://www.baidu.com" id="baidu" name="baidu">

</FORM>
<FORM METHOD=POST ACTION="http://g.cn" id="google">
<INPUT onKeyUp="document.getElementById('baidu').submit();" type="text" />  <br/>
</FORM>
</BODY>
</HTML>


这个页面里有两个表单，一个id为baidu，一个id为google，google表单里有一个input标签的onKeyUp的事件是提交了id为

baidu的表单。

预期结果： 跳转到百度的页面

实际结果：跳转到google页面

接着我们再来做个实验：

看如下代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<FORM METHOD=POST ACTION="http://www.baidu.com" id="baidu" name="baidu">

</FORM>
<FORM METHOD=POST ACTION="http://g.cn" id="google">
<INPUT onKeyUp="document.getElementById('baidu').submit();" type="text" />  <br/>
<INPUT onKeyUp="document.getElementById('baidu').submit();" type="text" />  <br/>
</FORM>
</BODY>
</HTML>


预期结果： 跳转到百度的页面

实际结果：跳转到百度的页面

这是为什么？

经过多番尝试得出了以下结论：
当全部满足以下条件的时候，

页面有两个ID不一样的表单，分别为A,B

A表单里有且只有一个type 不为hidden 的input 标签D

D的onKeyDown , onKeyUp 和onKeyPress三个事件中的任何一个用document.getElementById().submit()方法去提交另一个表单B

就会出现提交的表单是A

个人觉得是： javascript 把这个事件处理成了表单的提交
注，IE7不具有这种特性
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航