单击按钮时更改图像 URL
本文关键字:图像 URL 按钮 单击 | 更新日期: 2024-10-31 12:21:19
在我的 asp.net 页面中,我有图像控件,其中myimage.png将在页面加载时显示。要求如下,使用文件上传控件浏览图像并单击上传按钮,需要在图像控件中显示即时预览。浏览图片后按下上传按钮时,现有的"myimage.png"将被删除,新图片将保存到同名的服务器路径中,需要在图片控制中显示预览。
问题是保存图像后,图像控件不会立即显示新图像。要查看图像页面需要重新加载。代码如下,在 aspx 页中,
<asp:Image ID="imgLogo" style="margin-left: -299px;" ImageUrl="~/images/myimage.png" runat="server" />
代码隐藏如下,
protected void btnUpload_Click(object sender, EventArgs e)
{
string filePath = FileUpload1.PostedFile.FileName;
File.Delete(Server.MapPath(@"~'images'myimage.png"));
FileUpload1.SaveAs(Server.MapPath(@"~'images'myimage.png"));
imgLogo.ImageUrl = Server.MapPath(@"~'images'myimage.png");
}
问候
这看起来像是浏览器缓存问题。
URL 与更改图像文件之前完全相同,因此缓存将使用最初命名的文件(在其缓存中)进行显示。
您可以通过向 url 添加一些额外(但未使用)的东西来克服这个障碍:
protected void btnUpload_Click(object sender, EventArgs e)
{
// Do your upload stuff here...
imgLogo.ImageUrl = "~/images/myimage.png?" + DateTime.Now;
}
必须重新加载页面的原因是因为 ASP.NET 代码是在服务器上执行的。因此,例如,每次单击内部带有服务器端代码的按钮时,请求都会发送到服务器,服务器执行您的代码并返回正确的响应。基本上:必须重新加载某些东西。不过,它不一定是整个页面。您可以强制浏览器使用 AJAX 扩展(如脚本管理器和更新面板)仅重新加载特定页面。
示例(aspx 页):
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Click the button."></asp:Label>
<br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Hello World" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
点击事件:
protected void Button1_Click(object sender, EventArgs e)
{
Label1.Text = "Hello world!";
}
此外,您可以使用 UpdatePanel 的Update()
方法强制面板更新其内容。