关于代码背后的图像文本

时间:2014-05-08 08:50:56

标签: javascript html asp.net

我的项目中有一些图像,这些图像中有文本代表项目中的类别。 将鼠标悬停在此图像上我们可以看到子类别。现在我遇到的问题是,我一直在寻找如何在后面的代码中获取图像文本。 请帮我解决一下。

 <asp:Image  ID="Image1" runat="server" 
               ImageUrl="~/Images/New Bitmap Image(1).bmp" Width="180px" 
             CssClass="class1" Height="96px" />

2 个答案:

答案 0 :(得分:0)

添加图像时是否知道图像文字? 如果是,那么您可以在数据属性中添加该文本,并使用js代码轻松访问它。

<img id="temp" src="/images/43/jpg" data-text="43" />

Js Code

document.getElementById("temp").getAttribute("data-text");

答案 1 :(得分:0)

除非您执行某些图像处理代码,否则无法直接在后面的代码中访问图像中使用的文本。

最好设置alt并在后面的代码中访问它。

<asp:Image runat="server" ID="img" ToolTip="My Image Text" ImageUrl="some.jpeg"/>

这将呈现为

<img src="" alt="My Image Text" id="img" />

在Codebehind中

string imageText=img.ToolTip

<强> 更新

使用隐藏字段来了解点击了子类别的图像

<asp:Image runat="server" ID="img" ToolTip="My Image Text" 
onclick="setSelectedImage(this)" ImageUrl="some.jpeg"/>

<asp:HiddenField id="hdnSelected" runat="server" />

页面中的Javascript

function setSelectedImage(obj)
{
  //based on your condition to check it has subcategories
   document.getElementById("<%= hdnSelected.ClientID %>").value=obj.id;
}

在Code背后

Image selectedImg=(Image)Page.FindControl(hdnSelected.Value);
string text=selectedImg.ToolTip