Question

我想在单个HTML页面上创建一个登录表单，以便与JQuery一起显示（我是该技术的新手）。

我想知道是否应该使用<div>并隐藏/显示它，或者使用<form>并隐藏/显示它。该信息将通过Ajax发送到servlet。

如果我使用<div>，我应该使用什么来代替表单中提供的<input>？

如果我使用<form>，我相信我必须提供一个令人讨厌的动作，因为我使用的是单页。有没有办法躲避这个问题？

在这种情况下，<div>或<form>使用的推荐登录方法是什么？

Answer 1

如果我使用<div>，我应该使用什么来代替表单中提供的<input>？

在<input>之外加入<form>是完全合法的。

说过我通常会使用<form>，因此您可以绑定到其onsubmit事件，而不必担心人们按Enter键提交表单以及生成的事件（这是取决于浏览器和表单的内容）。最好将表单标记为表单，让浏览器应用其正常的表单行为，而不是试图伪造它。

理想情况下，为了正确地进行渐进式增强，您应首先使表单无需JavaScript，因此实际上有一些有用的东西可以指向action。然后在顶部添加脚本/ XMLHttpRequest。如果必须具有仅适用于脚本的表单，您可以将其从脚本添加到页面中，以便非JS用户不会出现这种情况，并且他们不会因为尝试提交它而感到困惑

Answer 2

我想知道我是否应该使用<div>隐藏/显示它，或使用<form>隐藏/显示它。

使用表格。 Build on things that work

如果我使用<div>，我应该使用什么来代替表单中提供的<input>？

如果您使用div，那么您仍然会使用输入，但使用表单。

如果我使用<form>，我相信我必须提供一个令人讨厌的动作，因为我使用的是单页。

不要那样做。建立有用的东西。

Answer 3

它几乎没有区别 - 除非你担心semantic content（一个<form>传达它意味着用户输入比<div>更清楚，{{3} （<form>仍可在没有JavaScript的情况下工作，graceful degradation（这可能需要保持优雅的降级），accessibility或progressive enhancement。

Answer 4

您应该使用<form>代码，因为它在语义上是正确的（用户填写登录表单）。

您可以在表单上放{{1}}，并阻止表单尝试使用action=""属性进行提交：

onsubmit

Answer 5

如果您规划的应用适用于未启用JavaScript的用户，请使用form元素，这是在HTML中进行表单提交的标准方式。

如果仅适用于ajax类型的回发，您也可以使用DIV。当然，您无论如何都需要<input ../>元素，因为这些元素不能被其他任何元素替代。

如果使用form方法，您会得到一件事 - 然后您可以调用表单元素的serialize()方法来获取字符串中的所有字段名称+值。

编辑：不，实际上serialize()方法可用于任何DOM元素，因此form优于div。

用于JQuery登录的HTML表单或div？

5 个答案: