Question

我在ASP.NET 4.5 / VS 2013中有这段代码

<asp:HyperLink ID="ht" runat="server" NavigateUrl='<%# Eval("Url") %>'>
   <asp:Image ID="img" runat="server" CssClass="img-responsive" 
    ImageUrl='<%# Eval("Image") %>'></asp:Image>
</asp:HyperLink>

并且根本没有渲染超链接内的图像，为什么？我也试过静态图像链接，但我得到了相同的结果。

我需要超链接内的图像，因为我需要图像的自定义css类

Answer 1

我测试了你的代码并正确渲染了图像。最糟糕的情况是，您可以使用DataList.ItemDataBound Event来绑定数据。

ASPX

<asp:DataList ID="DataList1" runat="server" 
     OnItemDataBound="DataList1_ItemDataBound">
    <ItemTemplate>
        <asp:HyperLink ID="ht" runat="server">
            <asp:Image ID="img" runat="server" CssClass="img-responsive"/>
        </asp:HyperLink>    
    </ItemTemplate>
</asp:DataList>

背后的代码

public class MyClass
{
    public string Url { get; set; }
    public string Image { get; set; }
}

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        DataList1.DataSource = new List<MyClass>
        {
            new MyClass
            {
                Url = "http://www.google.com",
                Image = "https://www.google.com/images/srpr/logo11w.png"
            },
            new MyClass
            {
                Url = "http://www.msn.com",
                Image = "http://col.stb00.s-msn.com/i/80/53CAC6A10B6248682CF221B24A92.gif"
            },
        };
        DataList1.DataBind();
    }
}

protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item ||
        e.Item.ItemType == ListItemType.AlternatingItem)
    {
        var item = e.Item.DataItem as MyClass;

        var ht = e.Item.FindControl("ht") as HyperLink;
        ht.NavigateUrl = item.Url;

        var img = e.Item.FindControl("img") as Image;
        img.ImageUrl = item.Image;
    }
}

如果您使用DataSet或DataTable，则需要将 DataItem 强制转换为 DataRowView 。 var dr = e.Item.DataItem as DataRowView;。 look at this example.

Answer 2

asp:HyperLink Web控件呈现为锚标记，<asp:HyperLink> ... </asp:HyperLink>之间的任何内容都成为Text属性的值。

我建议您尝试使用asp:ImageButton代替您的目的。

<asp:ImageButton ID="ibtnMyControl" CssClass="img-responsive" PostBackUrl="<%# Eval("Url") %>" ImageUrl="<%# Eval("Image") %>" />

ImageButton API reference

asp：在asp：HyperLink中根本不渲染图像

2 个答案:

ASPX