序列化文件类型jQuery
我正在尝试使用jquery.form.js jQuery API序列化包含文件图像字段的表单数据。 API正在帮助我将包括图像和返回图像对象在内的数据字段作为[object file]
这是我的序列化代码
var data = $js("form[name=ajx_imgupload]").formSerialize(); var img = $js("#upload_image").fieldSerialize(); $js.ajax({ url: "index.php?option=com_obituary&task=upload", type: "POST", dataType:"json", data: data, beforeSend: function(){ $js(".loadingblock").show(); }, complete: function(){ $js(".loadingblock").hide(); }, success: function(res){ alert(); }, error: function(jqXHR, textStatus, errorThrown){ alert(textStatus); } });
陷入困境…帮助将不胜感激。
谢谢
让我来帮助你。 我在1天前做过这个。 我有包括图像领域的forms。 当你通过jquery.form.js提交上传图片jquery.form.js
注意：我正在使用jqueryimageupload.php上传文件，如果你想我可以粘贴它。 这是一个简单的PHP文件上传。 http://www.w3schools.com/php/php_file_upload.asp
HTML部分：
jQuery的：
function ImageUpload() { $("#return").show(); $("#return").html(''); $("#return").html('
wait, uploading...'); $("#imageform").ajaxForm({ target: '#return', success: function() { $("#return").fadeOut(10000); } }).submit(); }
在最后表格提交：
$('#form').submit(function() { var img=$('#image').val(); var forms=($(this).serialize()); $.ajax({ type:"POST", url: "do.php?do=upload", data:forms+'&r='+encodeURIComponent(img), success: function(result){ //your code } }); });
你可以这样使用（来自http://portfolio.planetjon.ca/2014/01/26/submit-file-input-via-ajax-jquery-easy-way/ ）
$( '#my-form' ) .submit( function( e ) { $.ajax( { url: 'http://host.com/action/', type: 'POST', data: new FormData( this ), processData: false, contentType: false } ); } );
它更灵活，更简单
您不能使用ajax进行文件上传。 要模拟效果，您可以在隐藏的iframe中使用表单，并将/ .submit()提交到上传url。
或多或少喜欢这个。
HTML
Javascript（请注意，自我后面的任何方法都是实例方法，我使用Joose）
$(form).ajaxSubmit({//note that form is just the form built with a jQuery selector url: self.returnBaseULR() + '/ajaxadd', type: 'POST', error: function(xhr, status, error) { console.log('Unable to contact the server'); }, success: function(response){ var jsObjectFromResponse = JSON.parse(response); if(jsObjectFromResponse.success){ self.cLog('Item uploaded successfully!'); document.location.reload(); } else { self.cLog('Listing failed, see AJAX response'); } } });
您不能仅使用jQuery本机方法上传图像。 查看http://jquery.malsup.com/form/
它有完美的方法可以帮到你。
这似乎对我有用。 在后端我可以使用$ _POST获取POST参数和使用$ _FILES（或类似的东西）的文件
看起来ajaxSubmit会立即发布表格，并自动完成序列化数据。
希望有所帮助。