为什么这个fileupload函数返回状态错误?

时间:2016-03-04 04:14:11

标签: javascript jquery jquery-ui jquery-plugins

过去几个小时我遇到了问题。我不明白为什么以下函数返回错误状态。我想要做的是最初我上传三个图片,但在窗体底部有一个按钮,添加一个新的输入字段来添加新的方案。当我上传具有以下代码的给定表单的文件时。

<ul class="upload-section-wrap">
                 <li>
                    <div class="default-scenario-pic">
                       <div class="scenario-pic"> <span class="scenario-uploaded-file" data-div="3"></span> <a href="#/" class="file-browse-button gray-btn-link">Browse</a> 
                          <input type='file' name='audio_file_<?php echo rand(1,10000);?>' style="font-size:1px;opacity:0;"/>
                       </div>
                       <input type="hidden" class="field_scenario_image" value="" name="scenario_file[fid][2]">
                    </div>
                 </li>
                 <li><a href='#/'  class='gray-btn-link add-comment-block'>Comments</a>
                    <div style="display:none;" class="scenario-comment-block">
                       <div class="messageform">
                          <label>Comment</label>
                          <div class="messageform-content-wrap">
                             <div class="client-comment-body form-content">
                                <textarea placeholder="Comment" cols="30" name="sce_comment[2]" rows="5"></textarea>
                             </div>
                             <a href="#/" class="form-back-button close-colorbox">save</a> </div>
                       </div>
                    </div>
                 </li>
              </ul>

然后这个函数返回的状态是成功但是当我使用jquery将html添加到表单中时

<div class="upload-image-section-wrapper">
   <ul class="upload-section-wrap">
      <li>
         <div class="default-scenario-pic">
            <div class="scenario-pic"> 
               <span class="scenario-uploaded-file" data-div="1"></span>
               <a href="#/" class="file-browse-button gray-btn-link">Browse</a> 
               <input type="file" name="audio_file_'+number+'" style="font-size:1px;opacity:0;"/>
            </div>
            <input type="hidden" class="field_scenario_image" value="" name="scenario_file[fid][0]">
         </div>
      </li>
      <li>
         <a href="#/"  class="gray-btn-link add-comment-block">Comments</a>
         <div style="display:none;" class="scenario-comment-block">
            <div class="messageform">
               <label>Comment</label>
               <div class="messageform-content-wrap">
                  <div class="client-comment-body form-content">
                     <textarea placeholder="Comment" cols="30"  name="sce_comment[0]" rows="5"></textarea>
                  </div>
                  <a href="#/" class="form-back-button close-colorbox">save</a> 
               </div>
            </div>
         </div>
      </li>
   </ul>
</div>

其中&#39;数字&#39;是一个具有随机生成变量的变量。当我追加上面的代码并尝试上传图像时,该函数返回错误消息。文件上传功能如下

$('.default-scenario-pic').fileupload({
        dropZone: $('.scenario-pic'),
        limitMultiFileUploads : 1,
        add: function (e, data) {
            $('#multiform-primary-form').append('<div class="loading-large-wrapper fixed-top"><div class="loading-icon fixed-top"></div></div>');
            $(this).addClass('processing');
            var number = 1 + Math.floor(Math.random() * 1000);
            $(this).find('.scenario-uploaded-file').prop('id','pic-'+number);
                var file_name = data.files[0].name;
                var reader = new FileReader();
                reader.readAsDataURL(data.files[0]);
                reader.onloadend = function(){
                    $('#pic-'+number).parents().closest('.upload-section-wrap').css("background-image", "url("+this.result+")");
                }
            var file_name = data.files[0].name;
            var new_file_name = '';
            if(file_name.length > 25){
                new_file_name = file_name.substring(0,20)+"...";
            }else{
                new_file_name = file_name;
            }
            $('#pic-'+number).html(new_file_name);
            var jqXHR = data.submit();
        },
        progress: function(e, data){
        },
        fail:function(e, data){
            $('.loading-large-wrapper').remove();
            alert('Problem uploading file, please try again!');
        },
        done: function (e, data) {
            var st = jQuery.parseJSON(data.result);
            if(st.status == 'success'){
                //$(this).closest('.default-scenario-pic').find('img').attr({'src':st.url});
                $(this).closest('.default-scenario-pic').find('.field_scenario_image').val(st.fid);
            }
            $('.loading-large-wrapper,.loading-icon').remove();
        }
    });
});

我不明白这个问题。任何帮助将不胜感激。

0 个答案:

没有答案