文本框获取焦点后点击回车提交和不提交: 在有些时候为了方便,可能有这样的需求,那就是当表单中的文本框获取焦点的时候,点击enter回车键能够实现表单提交功能,但是有些时候我们不希望有类似的功能,比如表单比较庞大,辛辛苦苦填写了半天表单,一个回车误操作,导致表单提交。实现上述两种功能通常使用javascript,其实使用css也是可以粗略做到此功能。 (1).一个文本框的时候,提交按钮type不管是submit还是button,文本框获得焦点,点击回车会提交: [HTML] 纯文本查看 复制代码运行代码 1 2 3 4 < form action = "http://www.softwhy.com" > < input type = "text" > < input type = "button" value = "提交" > </ form > (2).一个文本框的时候怎么才能做到不提交,方法是加一个隐藏掉的文本框: [HTML] 纯文本查看 复制代码运行代码 1 2 3 4 5 < form action = "http://www.softwhy.com/" > < input type = "text" > < input type = "text" style = "display:none" > < input type = "button" value = "提交" > </ form > (3).只要有type为submit的按钮存在,一个文本框还是多个文本框都提交: [HTML] 纯文本查看 复制代码运行代码 1 2 3 4 < form action = "http://www.softwhy.com/" > < input type = "text" > < input type = "submit" value = "提交" > </ form > 上面是一个文本框的情况。 [HTML] 纯文本查看 复制代码运行代码 1 2 3 4 5 < form action = "http://www.softwhy.com/" > < input type = "text" > < input type = "text" > < input type = "submit" value = "提交" > </ form > 上面是多个文本框的情况。 (4).多个文本框的时候,不提交,用type为button的按钮即可: [HTML] 纯文本查看 复制代码运行代码 1 2 3 4 5 < form action = "http://www.softwhy.com/" > < input type = "text" > < input type = "text" > < input type = "button" value = "提交" > </ form > (5).type为image的按钮,等同于type为submit的效果: [HTML] 纯文本查看 复制代码运行代码 1 2 3 4 5 < form action = "http://www.softwhy.com/" > < input type = "text" > < input type = "text" > < input type = "image" src = "images/antzone.jpg" > </ form > 总结如下: (1).如果表单里有一个type=”submit”的按钮,回车键生效。 (2).如果表单里只有一个type=”text”的input,不管按钮是什么type,回车键生效。 (3).如果按钮不是用input,而是用button,并且没有加type,IE下默认为type=button,FF默认为type=submit。 (4).其他表单元素如textarea、select不影响,radio checkbox不影响触发规则,但本身在FF下会响应回车键,在IE下不响应。 (5).type=”image”的input,效果等同于type=”submit”,不知道为什么会设计这样一种type,不推荐使用,应该用CSS添加背景图合适些。