使用jquery更改ImageUrl

Question

我在asp.net中有以下超链接：

<asp:HyperLink ID="a" runat="server" ImageUrl="1.png" NavigateUrl="https://google.com/"></asp:HyperLink>

我想通过jquery将ImageUrl更改为2.png。我正在尝试这样做，但它不起作用：

$("#a").attr("ImageUrl", "2.png");

Answer 1

这里有几件事..。

我发现如果包含runat属性，就不能以这种方式选择元素。您将需要像这样引用对象...

var hyperLink = document.getElementById("<%= a.ClientID %>");

这应该会得到正确的对象。现在，asp:超链接保存为附加了图像的锚点。因此，您可以像这样引用和更改源代码。

$(hyperLink).find("img").attr('src', '2.png');

Answer 2

imageurl在渲染客户端时并不存在。它应该会把你的asp控件变成这样。

<a href="/myurl.aspx"><img src="/my/image.jpg" /></a>

你应该使用像这样的东西

$("#<%=a.ClientID%>").find("img").attr("src", "2.png");

我没有对此进行测试，但它应该会让您走上正确的道路。

Answer 3

您需要查看由.NET呈现的标记，而不是服务器端代码。

因此，通过查看标记，您将看到以下内容：

<asp:HyperLink ID="a" runat="server" ImageUrl="1.png" NavigateUrl="https://google.com/"></asp:HyperLink>

渲染它(至少在.net 4.0中)：

<a id="a" href="https://google.com/">
    <img alt="" src="1.png">
</a>

虽然在我的小测试项目中，markup id与webforms id匹配，但情况并不总是如此。

因此，要使用jquery更改图像，您只需说：

$('img', $('#<%= a.ClientID %>')).attr('src', '2.png');

这将在ID为a的标记中找到image标记，并更改其src属性。

一句忠告--使用比'a‘更好的ID名称。你的标记需要容易理解。此外，在处理webforms时(就像我上面所说的)，请始终在jquery中使用<%= tagid.ClientID %>。