Question

我正在尝试使用jQuery.ajax上传图片而不使用表单。

我知道如何选择输入框的值

var catSelect=$("#category").val();

但我如何上传图片（不制作表格）。

HTML

<div id="tnail"> 
   <input id="profile-image-upload" class="hidden" type="file"> 
   <img id="simg" height="126" width="224" src="'+tmb+'"> 
</div>

jquery的：

$('#simg').on('click', function() { 
     $('#profile-image-upload').click();
});

 $('#profile-image-upload').change(function() {
     alert( "Handler for .change() called." );  
 });

Answer 1

你可以使用 http://jsfiddle.net/Quwn6/

  $('#simg').on('click', function() { 
      $('#profile-image-upload').click();
  });

   $('#profile-image-upload').change(function() {
       var formData = new FormData(this.files[0]);
       $.ajax({
          url: '/echo/json/',
          type: 'POST',
          data: formData,
          //Options to tell JQuery not to process data or worry about content-type
          cache: false,
          contentType: false,
          processData: false
      });
  });

Answer 2

我在Google上输入了jquery file upload site:github.com，找到了blueimp's "jQuery File Upload"。它最近被创作（2014年2月26日）并且有很多观察者。希望有所帮助！

在the FAQ for the plugin中，它说：

插件是否需要表单或文件输入字段？

如果您定义了url（可能还有paramName）选项，则可以在任何元素上调用插件 - 无需任何表单或文件输入字段 - 并且拖放功能仍然有效。

要支持没有XHR文件上传功能的浏览器，文件输入字段必须是窗口小部件的一部分，或者使用fileInput选项定义。

您也可以使用site:stackoverflow.com在此处查找相关问题！

有一个好的。

如何使用jquery选择图像并上传？

2 个答案:

插件是否需要表单或文件输入字段？