sdf*_*for 74 html javascript forms
为什么<form>
单个<input>
字段的a会在用户输入值并按下时重新加载表单Enter,如果?中有2个或更多字段则不会<form>
.
我写了一个简单的页面来测试这种古怪.
如果您在第二个表单中输入一个值并按Enter键,您将看到它重新加载传递输入值的页面,就像您调用了一样GET
.为什么?我该如何避免呢?
<!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" />
<title>testFormEnter</title>
</head>
<body>
<form>
<input type="text" name="partid2" id="partid2" />
<input type="text" name="partdesc" id="partdesc" />
</form>
<p>2 field form works fine</p>
<form>
<input type="text" name="partid" id="partid" />
</form>
<p>One field form reloads page when you press the Enter key why</p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
Mit*_*ers 50
这是一个鲜为人知的"Quirk"已经出现了一段时间.我知道有些人已经以各种方式解决了这个问题.
在我看来,最简单的绕过就是只有第二个输入不会显示给用户.虽然在后端并不是所有用户友好,它确实可以解决问题.
我应该注意到,我听到这个问题最常见的地方是IE专用而不是FireFox或其他.虽然它似乎也影响了它们.
Vin*_*lds 49
这是IE6/7/8中的已知错误.您似乎没有得到它的修复程序.
您可以为此做的最佳解决方法是添加另一个隐藏字段(如果您的工程良知允许).当IE发现表单中有两个输入类型字段时,它将不再自动提交表单.
更新
如果你想知道为什么会这样,这个gem直接来自HTML 2.0规范(第8.2节):
如果表单中只有一个单行文本输入字段,则用户代理应接受该字段中的Enter作为提交表单的请求.
按Enter键的工作方式不同,具体取决于(a)有多少个字段和(b)有多少个提交按钮.它可能什么都不做,它可能会提交没有"成功"提交按钮的表单,或者它可能会假装点击第一个提交按钮(甚至为它生成onclick!)并使用该按钮的值提交.
例如,如果您input type="submit"
向两个字段的表单添加一个,您会注意到它也提交了.
这是一个古老的浏览器怪癖,至少可以追溯到早期的Netscape(可能更远),现在不太可能改变.
<FORM>
没有'动作'无效.如果您不打算在任何地方提交,并且您不需要单选按钮名称分组,则可以完全省略表单元素.
这是我用来解决问题的代码:
<form>
<input type="text" name="partid" id="partid" />
<input type="text" name="StackOverflow1370021" value="Fix IE bug" style="{display:none}" />
</form>
Run Code Online (Sandbox Code Playgroud)
小智 5
不,默认行为是在输入时,提交表单中的最后一个输入.如果您根本不想提交,可以添加:
<form onsubmit="return false;">
Run Code Online (Sandbox Code Playgroud)
或者在你的输入中
<input ... onkeypress="return event.keyCode != 13;">
Run Code Online (Sandbox Code Playgroud)
当然有更漂亮的解决方案,但这些更简单,没有任何库或框架.
归档时间: |
|
查看次数: |
33552 次 |
最近记录: |