为什么在通过Ajax提交时使用表单标签?
哲学问题:
说我有一个需要 JavaScript和一个现代浏览器的networking应用程序,所以渐进增强不是一个问题。 如果我的表单是通过JavaScript构build的,而且我的数据更新都是通过ajax POSTs&PUT完成的,那么真的有什么理由将我的控件包装在表单标签中吗? 如果我仍然要使用标签,出于语义或结构的原因,是否有任何理由有行动和方法的参数,我会忽略? 这种感觉就像是从一个早期的时代一直延续到我身上。
至less有一个重要的用户体验function,通过在表单标签中包装input特别提供:
回车键将提交表格。 事实上,在Mobile Safari中,这是如何让“Go”button出现在键盘上 。
如果没有包装input的表单,则没有任何提交。
您当然可以通过按键事件提供input键行为,但我不知道这是否适用于移动设备。 我不了解你,但我宁愿使用浏览器提供的语义,而不是用事件来模仿它们。
在你的情况下,你只需要为表单提供一个onsubmit
事件处理程序,它将完成你的AJAX提交,然后return false
,取消实际的提交。
您可以简单地提供action=""
(意思是“self”), method
不是必需的 – 它默认为GET
。
如果你不需要渐进增强,理论上不需要它们。
另一方面, form
有一些很酷的分组和语义效果。 使用它们,您可以按逻辑将表单元素分组 ,并使脚本更容易收集某些元素的值。
例如,如果你想Ajax提交一些用户input,总是比较容易地说:“让我们把这个表单中的所有元素提交”,而不是说“让我们把这个input,这两个选项和这三个文本区域提交它们”。 根据我的经验,如果form
标签存在,它实际上可以帮助开发人员。
AJAX是伟大的,但作为JamWaffles(+1给他)说,使用form
标签提供了一个后备方法。
就个人而言,我使用表单标签,即使我用AJAX提交的东西,因为它在语法上是清晰的,并且可以很容易地抓住特定forms的所有input。 是的,你可以用div
或其他方法做这个,但正如我所说的,使用表单在语法上是很好的。
顺便说一下,屏幕阅读器会form
不同的form
处理form
的内容,因此无论您select何种方式,都有可访问性问题。 请注意,有趣的证据表明,谷歌考虑在其排名的可访问性,所以如果search引擎优化是你的关注,使用一个forms,并做对了。
简介:MVC的forms,简单的networking应用程序,面向组件,丰富的Web应用程序不好。
原因:表单不能嵌套其他forms:面向组件的体系结构的局限性很大。
详细信息:对于典型的MVC应用程序,表单很棒。 在丰富,复杂的Web应用程序中,使用了大量的JavaScript和AJAX以及大量的组件,我不喜欢表单。 原因:表单不能嵌套其他表单。 然后,如果每个组件都呈现一个表单,组件不能相互嵌套。 太糟糕了。 通过改变所有forms为div,我可以将它们嵌套,并且每当我想要抓取所有参数以便将它们传递给ajax时,我只需要(使用jQuery):
$( “#id_of_my_div”)find( “[名]”)序列化()。
(或其他一些过滤)
代替:
$( “#id_of_my_form”)序列化()。
虽然,由于感性和语义的原因,我一直以forms来expression我的divs的forms。
不是我能看到的。 我目前正在构build一个使用<form>
的web应用程序,但是我正在使用它们,因此如果用户禁用JavaScript( e.preventDefault
通常会停止表单发布),我有一个回退方法。 对于你的情况,你说的用户必须有JavaScript,一个<form>
标签是没有必要的,但是也可能是一个想法,无论如何浏览器需要做任何事情,或者作为访问它一种类。
简而言之,不,如果你正在做纯AJAX的话,你不需要使用<form>
,但是如果你突然决定在将来创build后备代码的话,可能会留下一个想法。
在我看来:如果你使用它的语义原因,然后按预期使用它。 action属性是必需的(也可以是空的)是格式良好的,你也可以通过设置action属性来分开你的URIs和你的js逻辑,然后在ajax调用之前读取它。
我不明白你为什么需要在这里使用表单标签。 使用表单标签的唯一原因(除了让你的标记validation)是如果你要让用户使用sumbitinput或button标签“提交”数据。 如果你不需要这样做,那么就没有必要了。 但是,不确定是否会被视为“有效”的标记。 如果你使用它,你可以只做<form action="">
因为action是form标签唯一必须的属性。 但是,你确实提出了一个好的观点,web应用程序的未来可能将不再需要传统的提交方式和forms。 非常有趣,让我开心。 呵呵 :)