javascript - 使用 jQuery.form 通过 ajax 将 input[type=file] 发送到 CodeIgniter

Question

这是基本html形式：

<?php echo form_open( 'controller' ); ?>  
  <fieldset>
    <input type="text" name="field_name_1" value="<?php echo set_value('field_name_1'); ?>"/>
    <input type="file" name="field_name_2" value="<?php echo set_value('field_name_2'); ?>"/>
    // more dynamically added form fields
    <input type="submit" />
  </fieldset>
<?php echo form_close(); ?>

我希望我通过jQuery Form Plugininput[type=file]被发送到它的控制器（与其他输入类型一起）。ajax

我有下面的代码，它适用于除input[type=file].

<script src="http://malsup.github.com/jquery.form.js"></script> 

var options = {
    url: "<?php echo site_url('new_account/validate_new_account'); ?>",
    type: 'POST',
    dataType: 'json',
    success: function(data) {

      if (data.length === 0) {
        alert('Form successfully submitted!');
      } else {
        alert("Some fields weren't answered successfully. Please answer them.");
        // attach server-side form validations to respective fields
        $.each(data, function(key, value){
          var container = '<div class="error">'+value+'</div>';
          $('.form-element input[name="'+key+'"]').after(container);
        });
      }

    }
};

$('#main-submit').click(function(e) {
  $('#professional-form').valid(); // jQuery validate
  $('#professional-form').ajaxSubmit(options);  
  e.preventDefault(); // redirect to other place only if successful form 
});

其他输入字段发送成功，但CodeIgniter 仍然没有收到文件。你们知道如何解决这个问题吗？

Answer 1

如以下链接所述，可以通过带有 jquery.form.js 的 ajax 上传文件：

http://malsup.com/jquery/form/#file-upload

Answer 2

通常无法通过标准 ajax 发布来上传文件。但是，有一些工具允许异步上传文件：

• http://blueimp.github.com/jQuery-File-Upload/
• http://www.plupload.com/

您不能使用标准 jquery 帖子执行此操作的原因是出于安全原因 javascript 无法读取本地文件。这些工具使用各种解决方案（例如隐藏的 iframe、Flash 或 HTML5 技术）绕过限制，具体取决于浏览器上可用的内容。