我用过这个例子
$("form#data").submit(function(){
var formData = new FormData($(this)[0]);
$.ajax({
url: window.location.pathname,
type: 'POST',
data: formData,
async: false,
success: function (data) {
alert(data)
},
cache: false,
contentType: false,
processData: false
});
return false;
});
我的例子如下:
HTML表单+ Ajax发送
<form enctype="multipart/form-data" method="post" name="fileinfo" id="fm" action="">
<label>Your email address:</label>
<input type="email" autocomplete="on" autofocus name="userid" placeholder="email" required size="32" maxlength="64" /><br />
<label>Custom file label:</label>
<input type="text" name="filelabel" size="12" maxlength="32" /><br />
<label>File to stash:</label>
<input type="file" name="file" required />
<input type="submit" value="Stash the file!" />
</form>
<div id="output"></div>
<script>
$('#fm').on('submit', function (event) {
event.preventDefault();
var fd = new FormData($(this)[0]);
fd.append("CustomField", "This is some extra data");
$.ajax({
url: __baseUrlWWW + "/test.php",
type: "POST",
data: fd,
processData: false, // tell jQuery not to process the data
contentType: false // tell jQuery not to set contentType
});
return false;
});
</script>
一切都会好的 - 但是当我把它发送给php时,我有阅读帖子的问题。我有这种形式的POST
Firebug返回
Array
(
[file] => Array
(
[name] => test.png
[type] => image/png
[tmp_name] => C:\wamp\tmp\php4E16.tmp
[error] => 0
[size] => 507
)
)
Array
(
[userid] => okok@dsada.eu
[filelabel] => test
[CustomField] => This is some extra data
)
HTML在浏览器新标签页中返回
Array (
[
-----------------------------318572418129603 Content-Disposition:_form - data;
_name] => "userid" okok@dsada.eu
-----------------------------318572418129603 Content-Disposition: form - data;
name = "filelabel" test
-----------------------------318572418129603 Content-Disposition: form - data;
name = "file";
filename = "b24_uam.png" Content-Type: image/png PNG IHDRHHÚőpPLTE˙˙˙UÂÓ~°IDAThíŐAV1Pß˙Ň7lOytŽşP Óü°đňúęľâzý~ŐV\˛O-e'NëC=x3,OdePú>ľ<qł-?× îX~ Wóôą|hÚžŘҢäę~ŚÎÄ_ĺ;5 şÜťk[>Ë:˝^50`ŃÉSKEÖű@ö3v;wK]"kÄ[ŻSÖRyűćŢóö?ÎRy{ÂÇ^lů,á˙ż'îŘň˝Ź-\[ÓĹ(EĺdĎâeWČRÝŽš6z\°6şlÍŘËŹĽ*lÖŕáeZŮR=ĆFÓ50,5É-¨yímŠĘMđ˝1ĺ°ÔeÍ=ÔČRufGŁ`ŠËĺböđŔ句PöđČňQň-üÄđ×\°$'CvÄ÷Aay*żcÁRŮŠOďÖÝÍm)KFÍć^ [ôżŤŢŕŔčä-uz0óÚojy$_ôtSKMâkDN)¸eŠIüů#jć˝-˘ˇT¤×׎íkźů}b;] => "CustomField" This is some extra data
#-----------------------------318572418129603-- )
我的问题是 - 如何在PHP中阅读? firebug中的浏览器在控制台中显示正确的格式化数组 - $ _post和$ _files,但浏览器中的视图以这种方式显示它。我在wamp localhost上运行它 - 但这不应该是我认为的问题吗?
答案 0 :(得分:0)
我认为我找到了答案 - 新标签正在处理帖子数据,因此无法通过点击“在firebug中的新标签页中打开”在新标签中以这种方式显示...
我想我应该给自己投票;)
答案 1 :(得分:0)
您的代码已更新
<form enctype="multipart/form-data" method="post" name="fileinfo" id="fm" action="">
<label>Your email address:</label>
<input type="email" autocomplete="on" autofocus name="userid" placeholder="email" required size="32" maxlength="64" /><br />
<label>Custom file label:</label>
<input type="text" name="filelabel" size="12" maxlength="32" /><br />
<label>File to stash:</label>
<input type="file" name="file" required />
<input type="submit" value="Stash the file!" />
</form>
<div id="output"></div>
<script>
$('#fm').on('submit', function (event) {
event.preventDefault();
var fd = new FormData($(this)[0]);
fd.append("CustomField", "This is some extra data");
$.ajax({
url: __baseUrlWWW + "/test.php",
type: "POST",
data: fd,
processData: true, // this is default so you can remove the line
contentType: 'multipart/form-data'
});
return false;
});
</script>
问题是您没有发送正确的contentType,并且您不允许调用将要添加的数据转换为查询字符串。由于您返回false,因此表单未发布,因此您不会发送您在表单中设置的用于发送文件上载的contentType。然后你告诉ajax调用不要在标题中发送contentType。您需要告诉您要在标头中发送multipart / form-data的ajax调用。然后是processData:true,默认情况下会将FormData对象合并到您的查询字符串中。
获取其他表单数据的唯一原因是因为您使用的表单创建FormData对象&#34;提交&#34;。