jquery - 序列化文件类型 jQuery

Question

我正在尝试使用 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);                
                 }
           });

遇到问题...我们将不胜感激。

谢谢

Answer 1

让我来帮助你。这是我 1 天前做的。我有包括图像字段的表格。当您通过 jquery.form.js

提交其上传图像时

注意:我正在使用 jqueryimageupload.php 上传文件，如果您愿意，我可以粘贴它。这是一个简单的php文件上传。 http://www.w3schools.com/php/php_file_upload.asp

html部分:

<form name="imageform" id="imageform" action="jqueryimageupload.php" method="post">
  <input type="file" name="resim" id="img" onchange="ImageUpload()" />
  <input type="hidden" name="action" value="imageup" />
</form>

jquery:

function ImageUpload() {
    $("#return").show();
    $("#return").html('');
    $("#return").html('<img src="images/load2.gif" alt="Uploading...."/> 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 }     
    });
 });