没有页面刷新＆然后上传图片显示图像

我有一个按钮，允许用户选择一个图像 - 如下所示：没有页面刷新＆然后上传图片显示图像

 <div id="fileUpload"> 
      <form id="joinPhotoUploadForm" method="POST" enctype="multipart/form-data"> 
      <input type="file" id="file"/> 
      </form> 
      <div id="fakefile"> 
      <img src="../../images/button-grey-enhanced.png" id="usePhotoSubmit" alt="BROWSE for Photo"> 
      <span id="usePhoto">BROWSE</span> 
      </div> 
     </div>

我然后需要将图像上传到服务器，并显示在图像没有页面刷新的同一页面。我已经试过如下：

$('input#file').change(function() { 
    $('form#joinPhotoUploadForm').submit(); 
});

我如何能得到的图片上传，没有一个页面在同一页上显示的刷新任何建议？

THX

来源

2012-09-07 Adam

你会需要一个AJAX调用，而不是一个表单提交......或者说，不是一个表单提交这样提供的解决方案。看看'$ .post（）'。 –

你可以使用AJAX作为@JeremyHolovacs建议，或者你可以简单地使用一个iframe，如果你没有页面刷新的愿望是纯粹的美学。 –

，你可以尝试在本教程中 http://www.youtube.com/course?list=EC7C25B2F18F68F3EF&feature=plcp

来源

2012-09-08 00:34:34 Erfan

你有没有考虑一个奇特的上传像Uploadify或Pupload？

来源

2012-09-08 00:27:58 Robyflc

我想避免因素的闪光灯因素...小工具支持IE7＆8吗？ – Adam

两者都可以使用html5（实际上uploadify html 5版本不是免费的，但花费5块钱）。我几乎可以肯定它的确如此。 – Robyflc

您可以使用现代浏览器中提供的FileReader和File API在上传文件之前先读取文件客户端并显示预览，然后允许用户在验证预览后上传。您还可以实现从桌面拖放图像到浏览器，而不是传统的文件选择输入。

这里是一个教程吧：http://www.html5rocks.com/en/tutorials/file/dndfiles/

在旧的浏览器，你可以只是回落到一个传统的文件输入与页面重新加载。

来源

2012-09-08 00:31:35 Mark

没有页面刷新＆然后上传图片显示图像

回答

相关问题