DIV里面的内容转发不可控

里面一个中继器的ItemTemplate，我有..DIV里面的内容转发不可控

retstr.AppendLine("<div id='contentDivImg' style='display: block;'><img src = '" & img_src & "' /></div>")

每个图像需要按下开关按钮/链接时隐藏和显示。虽然只有第一个IMAGE/DIV切换可见性，但以下图像中没有一个的路径也是通过上面的代码行从数据库中获取的。为什么？我试过使用类而不是id参数。

这里是JavaScript只有兴趣..

<script type="text/javascript"> 
    function toggle(showHideDiv, switchImgTag) { 
     var ele = document.getElementById(showHideDiv); 
     var imageEle = document.getElementById(switchImgTag); 
     if (ele.style.display == "block") { 
      ele.style.display = "none"; 
      imageEle.innerHTML = '<img src="/images/Show.png">'; 
     } 
     else { 
      ele.style.display = "block"; 
      imageEle.innerHTML = '<img src="/images/Hide.png">'; 
     } 
    } 
</script>

而且，这里是一个简单的肘杆，以显示和隐藏conntentDivImage点击时..

<a id="imageDivLink" href="javascript:toggle('contentDivImg', 'imageDivLink');"><img src="/images/Hide.png"></a>

来源

2014-11-24 Bryan Bankester

的getElementById只返回第一元素的ID，所以第一个是唯一一个将根据你的代码工作。我会添加一个用于ItemTemplates的计数器，为每个div分配一个唯一的ID，例如contentDivImg1和contentDivImg2，然后当您有锚标记的ItemTemplate时，确保在调用JavaScript函数时引用正确的ID。

来源

2014-11-24 19:47:22

问题是，在HTML中，ID是唯一的。在找到具有匹配ID的第一个元素后，document.getElementById()停止。在这种情况下，它会找到第一个<div>并忽略页面的其余部分。

但是，您可以更改您使用中继器，以更好地满足您的需求的方式：

如果你调整你的转发器，看起来更像是这样的：

<!-- the repeater now has an OnItemDataBound event --> 
<asp:Repeater runat="server" ID="rptDivs" OnItemDataBound="rptDivs_OnItemDataBound"> 
    <ItemTemplate> 
    <!-- The <div>, <img>, and <a> tags have runat="server". This is important. --> 
    <div runat="server" ID="div"><img runat="server" ID="img" /> 
     <a id="a" runat="server"><img src="/Images/Hide.png" id="img2" runat="server" /></a> 
    </div> 
    </ItemTemplate> 
</asp:Repeater>

...那么每个<div>并且中继器内的<img />将具有唯一的ID。 ID将如下所示：``。

您需要在页面的代码后面添加一个事件，以便为您的HTML设置属性（如src）。由于您已将OnItemDataBound事件添加到中继器，因此您可以在后面访问代码中的对象（这是使用C＃编写的，但该想法仍然可以在VB中使用）。

protected void rptDivs_OnItemDataBound(object sender, RepeaterItemEventArgs e) 
{ 
    // first, let's get the item that you have bound to your repeater 
    MyObject myObject = (MyObject)e.Item.DataItem; 

    // You can access the image and div objects here because they are set to runat="server" 
    HtmlImage img = (HtmlImage)e.Item.FindControl("img"); 
    HtmlImage buttonImg = (HtmlImage)e.Item.FindControl("img2"); 
    HtmlAnchor a = (HtmlAnchor)e.Item.FindControl("a"); 
    HtmlGenericControl div = (HtmlGenericControl)e.Item.FindControl("div"); 

    // you can now set the properties of the HTML in your code-behind 
    img.Src = myObject.imgSrc; 
    a.Attributes["onclick"] = "javascript:toggle('" + div.ID + "', '" + buttonImg.ID + "');"; 

}

每个重复元素的HTML输出现在可能是这个样子：

<div ID="body_body_div_1"><img ID="body_body_img_1" /> 
     <a id="body_body_a_1" onclick="javascript:toggle('body_body_div_1', 'body_body_img_1');"><img src="/Images/Hide.png" id="body_body_img2_1" runat="server" /></a> 
    </div>

...与ID的每个重复的元素之间的变化。

来源

2014-11-24 20:27:28 Chris

DIV里面的内容转发不可控

回答

相关问题