Html 在 FORM 中使用 DIV 是否正确?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9942538/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is it correct to use DIV inside FORM?
提问by demas
I'm just wondering what are you thinking about DIV-tag inside FORM-tag?
我只是想知道您对 FORM-tag 中的 DIV-tag 有何看法?
I need something like this:
我需要这样的东西:
<form>
<input type="text"/>
<div> some </div>
<div> another </div>
<input type="text" />
</form>
Is it general practice to use DIV
inside FORM
or I need something different?
DIV
在内部使用是一般做法FORM
还是我需要不同的东西?
回答by Royi Namir
It is totally fine .
完全没问题。
The form
will submit only its input type controls ( *also Textarea
, Select
, etc...).
该form
会只提交其输入型对照(*还Textarea
,Select
等...)。
You have nothing to worry about a div
within a form
.
您无需担心 adiv
内的 a form
。
回答by Alex W
It is completely acceptable to use a DIV inside a <form>
tag.
在<form>
标签中使用 DIV 是完全可以接受的。
If you look at the default CSS 2.1 stylesheet, div
and p
are both in the display: block
category. Then looking at the HTML 4.01 specification for the form element, they include not only <p>
tags, but <table>
tags, so of course <div>
would meet the same criteria. There is also a <legend>
tag inside the form in the documentation.
如果您查看默认的CSS 2.1 样式表,div
并且p
都在display: block
类别中。然后查看表单元素的 HTML 4.01 规范,它们不仅包括<p>
标签,还包括<table>
标签,所以当然<div>
会满足相同的标准。<legend>
文档中的表单内还有一个标签。
For instance, the following passes HTML4 validation in strict mode:
例如,以下在严格模式下通过 HTML4 验证:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Test</title>
</head>
<body>
<form id="test" action="test.php">
<div>
Test: <input name="blah" value="test" type="text">
</div>
</form>
</body>
</html>
回答by Manse
You can use a <div>
within a form - there is no problem there .... BUTif you are going to use the <div>
as the label for the input
dont ... label
is a far better option :
您可以<div>
在表单中使用 a - 那里没有问题....但是,如果您打算使用 the<div>
作为input
dont的标签...label
是一个更好的选择:
<label for="myInput">My Label</label>
<input type="textbox" name="MyInput" value="" />
回答by stefan bachert
It is wrong to have <input> as a direct child of a <form>
将 <input> 作为 <form> 的直接子元素是错误的
And by the way <input /> may fail on some doctype
顺便说一句 <input /> 可能会在某些文档类型上失败
Check it with http://validator.w3.org/check
使用http://validator.w3.org/check检查
document type does not allow element "INPUT" here; missing one of "P", "H1", "H2", "H3", "H4", "H5", "H6", "PRE", "DIV", "ADDRESS" start-tag
文档类型不允许在此处使用元素“INPUT”;缺少“P”、“H1”、“H2”、“H3”、“H4”、“H5”、“H6”、“PRE”、“DIV”、“ADDRESS”起始标签之一
<input type="text" />
<input type="text" />
The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.
提到的元素不允许出现在您放置它的上下文中;其他提到的元素是唯一允许出现并且可以包含提到的元素的元素。这可能意味着您需要一个包含元素,或者您可能忘记关闭前一个元素。
One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").
出现此消息的一个可能原因是您试图将块级元素(例如“<p>”或“<table>”)放入内联元素(例如“<a>”、“<span>”)中”,或“<字体>”)。
回答by Clinton
Your question doesn't address what you want to put in the DIV tags, which is probably why you've received some incomplete/wrong answers. The truth is that you can, as Royi said, put DIV tags inside of your forms. You don't want to do this for labels, for instance, but if you have a form with a bunch of checkboxes that you want to lay out into three columns, then by all means, use DIV tags (or SPAN, HEADER, etc.) to accomplish the look and feel you're trying to achieve.
您的问题没有解决您想放入 DIV 标签的内容,这可能是您收到一些不完整/错误答案的原因。事实是,正如 Royi 所说,您可以将 DIV 标签放入表单中。例如,您不想对标签执行此操作,但是如果您有一个包含一堆复选框的表单,并且您希望将其分成三列,那么请务必使用 DIV 标签(或 SPAN、HEADER 等) .) 来实现您想要实现的外观和感觉。
回答by Habib
Definition and Usage
The tag defines a division or a section in an HTML document.
The tag is used to group block-elements to format them with styles. http://www.w3schools.com/tags/tag_div.asp
定义和用法
该标签定义了 HTML 文档中的一个分区或一个部分。
该标签用于对块元素进行分组以使用样式对其进行格式化。 http://www.w3schools.com/tags/tag_div.asp
Also DIV - MDN
The HTML element (or HTML Document Division Element) is the generic container for flow content, which does not inherently represent anything. It can be used to group elements for styling purposes (using the class or id attributes), or because they share attribute values, such as lang. It should be used only when no other semantic element (such as or ) is appropriate.
HTML 元素(或 HTML Document Division Element)是流内容的通用容器,它本质上不代表任何内容。它可用于将元素分组以用于样式目的(使用 class 或 id 属性),或者因为它们共享属性值,例如 lang。仅当没有其他语义元素(例如 或 )适合时才应使用它。
You can use div inside form, if you are talking about using div instead of table, then google about Tableless web design
您可以在表单内使用 div,如果您正在谈论使用 div 而不是 table,那么谷歌关于 Tableless 网页设计
回答by JT Smith
As the others have said, it's all good, you can do it just fine. For me personally, I try to keep a form of hierarchical structure with my elements with a div
being the outer most parent element. I try to use only table
p
ul
and span
inside forms. Just makes it easier for me to keep track of parent/children relationships inside mywebpages.
正如其他人所说,这一切都很好,你可以做得很好。就我个人而言,我尝试使用我的元素保持一种层次结构形式,其中 adiv
是最外层的父元素。我尝试只使用table
p
ul
和span
内部表单。只是让我更容易跟踪我的网页内的父/子关系。
回答by Vincent Omondi
I noticed that whenever I would start the form tag inside a div the subsequent div siblings would not be part of the form when I inspect (chrome inspect) henceforth my form would never submit.
我注意到,每当我在 div 中启动表单标签时,后续的 div 兄弟姐妹在我检查(chrome 检查)时将不会成为表单的一部分,此后我的表单将永远不会提交。
<div>
<form>
<input name='1st input'/>
</div>
<div>
<input name='2nd input'/>
</div>
<input type='submit'/>
</form>
I figured that if I put the form tag outside the DIVs it worked. The form tag should be placed at the start of the parent DIV. Like shown below.
我想,如果我将表单标签放在 DIV 之外,它会起作用。表单标签应该放在父 DIV 的开头。如下图所示。
<form>
<div>
<input name='1st input'/>
</div>
<div>
<input name='2nd input'/>
</div>
<input type='submit'/>
</form>
回答by user2774731
Absolutely not! It will render, but it will not validate. Use a label.
绝对不!它将呈现,但不会验证。使用标签。
It is not correct. It is not accessible. You see it on some websites because some developers are just lazy. When I am hiring developers, this is one of the first things I check for in candidates work. Forms are nasty, but take the time and learn to do them properly
这是不正确的。它无法访问。您会在某些网站上看到它,因为有些开发人员只是懒惰。当我招聘开发人员时,这是我在候选人工作中首先检查的事情之一。表格很讨厌,但花点时间学会正确地做它们
回答by Starx
No, its not
不,这不对
<div>
tags are always abused to create a web layout. Its symbolic purpose is to divide a section/portion in the page so that separate style can be added or applied to it. [w3schools Doc][W3C]
<div>
标签总是被滥用来创建网页布局。它的象征目的是在页面中划分一个部分/部分,以便可以添加或应用单独的样式。[w3schools 文档] [W3C]
It highly depends on what your some
and another
has.
这在很大程度上取决于你的some
和another
拥有的。
HTML5, has more logical meaning tags, instead of having plain layout tags. The section
, header
, nav
, aside
everything have their own semantic meaning to it. And are used against <div>
HTML5,有更多的逻辑意义标签,而不是普通的布局标签。的section
,header
,nav
,aside
一切都有自己的语义含义吧。并且被用来对付<div>