当前位置：文江博客话题详情

上传头像图片，无需页面上传

发布于 2024-11-05 02:59:57 字数 78 浏览 1 评论 0原文

我想在我的项目中添加头像图片上传功能，我想知道是否存在任何 AJAX/jQuery 解决方案来上传图片而无需在上传后刷新页面（图片自动上传）。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

世界如花海般美丽 2024-11-12 02:59:57

我已经在几个项目中使用了 http://www.uploadify.com/ 并且效果很好。

回复收藏 0 原文

孤君无依 2024-11-12 02:59:57

貌似这个可以做，还没试过。

http://www.plupload.com/

回复收藏 0 原文

岁月静好 2024-11-12 02:59:57

您可以使用 iframe 作为目标，以避免整个页面重新加载：

<form method="post" action="your_action" enctype="multipart/form-data" target="myIframe">
   <input type="file" name="image" />
   <input type="submit" value="Upload image" />
</form>

<iframe name="myIframe" id="myIframe">
   //Post response will load here
</iframe>

You could use an iframe as target, to avoid full page reload:

<form method="post" action="your_action" enctype="multipart/form-data" target="myIframe">
   <input type="file" name="image" />
   <input type="submit" value="Upload image" />
</form>

<iframe name="myIframe" id="myIframe">
   //Post response will load here
</iframe>

回复收藏 0 原文

泅人 2024-11-12 02:59:57

尝试使用触发器更新面板不起作用！

不工作：

<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true"                                                           UpdateMode="Conditional" >
  <ContentTemplate>
     <asp:Repeater ID="rpUploadedImages" runat="server">
       <ItemTemplate>
        <img src='../Images/<%# DataBinder.Eval(Container.DataItem, "ImagePath")%>'/><br />
       </ItemTemplate>
     </asp:Repeater>
   </ContentTemplate>
   <Triggers>
       <asp:AsyncPostBackTrigger ControlID="btnupload" EventName="click" />
   </Triggers>
 </asp:UpdatePanel>

<asp:FileUpload ID="FileUpload1" runat="server" /><br />
<asp:Button ID="btnupload" runat="server" Text="Upload" onclick="btnupload_Click" />

可以工作：

所以你必须将整个 FileUpload 标签放在一个单独的页面中，并在主页的 iframe 中调用它，当然将“上传”按钮保留在 iframe 中；因此，通过单击上传按钮，iframe 将单独刷新，而不会刷新整个页面。
（经过充分测试）

trying update panel with a trigger DOES NOT WORK !!

DOESNT NOT WORK:

<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true"                                                           UpdateMode="Conditional" >
  <ContentTemplate>
     <asp:Repeater ID="rpUploadedImages" runat="server">
       <ItemTemplate>
        <img src='../Images/<%# DataBinder.Eval(Container.DataItem, "ImagePath")%>'/><br />
       </ItemTemplate>
     </asp:Repeater>
   </ContentTemplate>
   <Triggers>
       <asp:AsyncPostBackTrigger ControlID="btnupload" EventName="click" />
   </Triggers>
 </asp:UpdatePanel>

<asp:FileUpload ID="FileUpload1" runat="server" /><br />
<asp:Button ID="btnupload" runat="server" Text="Upload" onclick="btnupload_Click" />

DO WORK:

so you have to go with placing the whole FileUpload tag in a separate page, and call it in iframe in your main page, and of course keep the "Upload" button in the iframe; so by click on the upload button the iframe alone will refresh without refreshing the whole page.
(well tested)

回复收藏 0 原文

~没有更多了~