头像改变功能

Question

这是头像更改和上传。当我单击“上传新图像”按钮时，将出现第一个浏览窗口然后我选择一个头像然后选择头像将显示。这个功能可以在Jquery吗？

我的尝试： http://jsfiddle.net/anglimass/uBGpR/

任何人请帮助我!!

由于

Answer 1

这可以使用AJAX Upload jQuery插件完成。

从包含jQuery和插件开始：

<script src="/js/jquery.min.js" type="text/javascript"></script>
<script src="/js/ajaxupload.js" type="text/javascript"></script>

最终的JavaScript：

$(document).ready(function(){

  var thumb = $('img#thumb'); 

  new AjaxUpload('imageUpload', {
    action: $('form#newHotnessForm').attr('action'),
    name: 'image',
    onSubmit: function(file, extension) {
      $('div.preview').addClass('loading');
    },
    onComplete: function(file, response) {
      thumb.load(function(){
        $('div.preview').removeClass('loading');
        thumb.unbind();
      });
      thumb.attr('src', response);
    }
  });
});

此示例取自this very good tutorial。