WuShaolin

悟已往之不谏,知来者之可追!

0%

Form表单的两个新属性

引子

今天在实习工作中看到了两个新属性,其实一直就在,但是一直眼瞎,没去MDN去搜搜,今天搜了一下。明白了这俩属性。
在这个表单里面的两个以前没见的属性

<form name="upFileForm" method="post" action="/cgi-bin/action" onsubmit="return isUploadLogo();" target="returnMsg" enctype="multipart/form-data">
    <input type="hidden" name="action" value="uploadfile" />
    <input type="file" id="uploadLogo" name="TAGET_FILENAME" value="logo.gif" />
    <input type="submit" id="immUpdate" class="newButtonStyle" name="uploadLogo" value="立即更新" />
</form>
  • enctype属性

method属性值为 post 时, enctype 是提交form给服务器的内容的 MIME 类型,可能的取值有:
application/x-www-form-urlencoded: 如果属性未指定时的默认值。
multipart/form-data: 这个值用于一个 type 属性设置为 “file” 的 <input> 元素。
text/plain (HTML5)这个值可以被 <button>或者 <input> 元素中的 formenctype属性重载(覆盖)。

MDN写的真是好啊
我这个例子中就是设置的是multipart/form-data ,对应的第二个input立即更新的界面.png

  • target 属性

target一个名字或者说关键字,用来指示在提交表单之后,在哪里显示收到的回复。在 HTML 4 里, 这是一个用于 frame 的名字/关键字. 在 HTML5 里, 这是一个用于 browsing context 浏览器上下文 的名字/关键字 (举例来说, 标签页tab, 窗口window, or 或者行内 frame). 如下的关键字含有特别的含义:
_self: 在当前HTML4或HTML5文档页面重新加载返回值。这个是默认值。译注:也就是说如果这个文档在一个frame中的话,self是在当前frame(document)中重新加载的,而不是整个页面(window)。
_blank: 以新的HTML4或HTML5文档窗口加载返回值。
_parent: 在父级的frame中以HTML4或HTML5文档形式加载返回值,如果没有父级的frame,行为和_self一致。
_top: 如果是HTML 4文档: 清空当前文档,加载返回内容;HTML5: 在当前文档的最高级内加载返回值,如果没有父级,和_self的行为一致。
iframename: 返回值在指定frame中加载。
HTML5: 这个值可以被 <button>或者 <input> 元素中的formtarget属性重载(覆盖)。

target和enctype属性.png
不过有疑问的是这里写的是returnMsg是啥意思呢?