asp.net - 动态设置图片src asp.net

Question

是否可以通过单击按钮设置图像的 src。我的每个按钮都代表一张应该显示在我的“图像”区域中的图片。我需要图像区域的 SRC 属性受按钮单击的影响。我在 c# 中使用 Visual Studio 2012。

-编辑：在 Visual Studio 2012 中使用 AJAX 更新面板和 C#

Answer 1

是的。您将能够通过使用 JavaScript 并将单击处理程序附加到按钮 (onclick="loadImage1()") 来完成此操作。

loadImage1 函数将要求您编写访问图像元素的 src 属性并对其进行更改所需的 javascript。

您可以使用纯 javascript（参见上面的概念）或使用一些 javascript 库（如 jQuery）来实现这一点。为了跨浏览器的兼容性并让您不必编写跨浏览器安全逻辑，我建议使用 jQuery 来处理这个问题。

<img id="img1" src="initialimagehere.jpg"/>

然后您可以像这样更改 src 属性：

$("#img1").attr("src","newimagehere.jpg");

jQuery：这个链接

Answer 2

如果每次图像更改都可以接受回发，则可以执行以下操作：

在 C# 中：

protected void btnClick(object sender, EventArgs e) {

            Button btn = (Button) sender;    

            switch (btn.ID) {

                case "btn1": img.ImageUrl = "<Image_Url>"; break;

                case "btn2": img.ImageUrl = "<Image_Url>"; break;            
            }
        }

在 ASPX 页面中：

<asp:Image ID="img" runat="server"  />
<asp:Button ID="btn1" runat="server" OnClick="btnClick" />
<asp:Button ID="btn2" runat="server" OnClick="btnClick" />

Answer 3

我注意到如果我没有首先在我的 .aspx 代码中为 ImageUrl 指定一个值，我就无法在 .aspx.cs 代码中设置它。

即，如果我的 .aspx 代码为：

<asp:Image runat="server" id="imgPickLg0101" class="ImgSzLarge" />

我无法在后面的代码中设置它。

但是，如果我首先为 ImageUrl 指定了一个值：

<asp:Image runat="server" id="imgPickLg0101" class="ImgSzLarge" ImageUrl="../Images/somepic.jpg" />

然后我可以在 .aspx.cs 代码中设置它：

imgPickLg0101.ImageUrl = "../Images/DifferentPicture.jpg";