blob: e07fc461854d765f1194a1dfb6215db8ccd6726d (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
|
---
title: FormData.set()
slug: Web/API/FormData/set
translation_of: Web/API/FormData/set
---
<p>{{APIRef("XMLHttpRequest")}}</p>
<p><code><strong>set()</strong></code> 方法会对 <code>FormData</code> <code>对象里的某个</code> <code>key</code> <code>设置一个新的值，如果该</code> <code>key</code> <code>不存在，则添加。</code></p>
<p><code>set()</code> 和 {{domxref("FormData.append")}} 不同之处在于：如果某个 key 已经存在，<code>set()</code> 会直接覆盖所有该 key 对应的值，而 {{domxref("FormData.append")}} 则是在该 key 的最后位置再追加一个值。</p>
<div class="note">
<p><strong>注意</strong>: 该方法在 <a href="/en-US/docs/Web/API/Web_Workers_API">Web Workers</a> 可用。</p>
</div>
<h2 id="语法">语法</h2>
<p>该方法有两种使用方式，一个是传入两个参数，一个是传入三个参数。</p>
<pre class="brush: js">formData.set(name, value);
formData.set(name, value, filename);</pre>
<h4 id="append()_Parameters" name="append()_Parameters">参数</h4>
<dl>
<dt><code>name</code></dt>
<dd>字段名称。</dd>
<dt><code>value</code></dt>
<dd>字段的值，如果是传入两个参数的方式，那么该值是一个 {{domxref("USVString")}}，如果不是，将被转成一个字符串。如果是传入三个参数的方式，那么该值将是一个布尔值（{{domxref("Blob")}}），文件（{{domxref("File")}}），或者一个 {{domxref("USVString")}}，如果不是，将被转成一个字符串。</dd>
<dt><code>filename </code>{{optional_inline}}</dt>
<dd>当第二个参数传递的是一个blob对象（{{domxref("Blob")}}）或者file对象（{{domxref("File")}}），filename参数就代表传给服务端的文件名（一个{{domxref("USVString")}}）。{{domxref("Blob")}} 对象的默认文件名是 "blob"。</dd>
</dl>
<div class="note">
<p><strong>注意:</strong> 如果对 FormData 对象插入一个blob对象（ {{domxref("Blob")}}），那么发送给服务器的请求头部（header） 里的 “Content-Disposition” 里的文件名称将会根据浏览器的不同而不同。</p>
</div>
<h2 id="示例">示例</h2>
<p>先创建一个空的 <code>FormData</code> <code>对象：</code></p>
<pre class="brush: js">var formData = new FormData(); // Currently empty</pre>
<p>使用 {{domxref("FormData.set")}} 设置键/值 ：</p>
<pre class="brush: js">formData.set('username', 'Chris');
formData.set('userpic', myFileInput.files[0], 'chris.jpg');</pre>
<h2 id="规范">规范</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">规范</th>
<th scope="col">状态</th>
<th scope="col">说明</th>
</tr>
<tr>
<td>{{SpecName('XMLHttpRequest','#dom-formdata-set','set()')}}</td>
<td>{{Spec2('XMLHttpRequest')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatChrome(50.0)}}</td>
<td>{{CompatGeckoDesktop("39.0")}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
<tr>
<td>Available in web workers</td>
<td>{{CompatChrome(50.0)}}</td>
<td>{{CompatGeckoDesktop("39.0")}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Android Webview</th>
<th>Firefox Mobile (Gecko)</th>
<th>Firefox OS (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
<th>Chrome for Android</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatNo}}</td>
<td>{{CompatChrome(50.0)}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatNo}}</td>
<td>
<p>{{CompatNo}}</p>
</td>
<td>{{CompatNo}}</td>
<td>{{CompatChrome(50.0)}}</td>
</tr>
<tr>
<td>Available in web workers</td>
<td>{{CompatNo}}</td>
<td>{{CompatChrome(50.0)}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatChrome(50.0)}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="sect1"> </h2>
<h2 id="相关链接">相关链接</h2>
<ul>
<li>{{domxref("XMLHTTPRequest")}}</li>
<li><a href="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest" title="Using XMLHttpRequest">Using XMLHttpRequest</a></li>
<li><a href="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects" title="DOM/XMLHttpRequest/FormData/Using_FormData_objects">Using FormData objects</a></li>
<li>{{HTMLElement("Form")}}</li>
</ul>
|
