2013-09-01 85 views
0

我有一個轉發器控件來顯示用戶評論。註釋保存在div標籤中,並且在該div標籤內還有其他標籤。我將一個懸停屬性分配給父標籤,以使mouseover上的子標籤可見。當我運行代碼時,懸停屬性只能用於中繼器中的第一條評論。如果鼠標懸停在其他評論上,懸停屬性將再次用於第一條評論。這裏是我的html代碼 `在轉發器控件中設置子標籤屬性

 <ItemTemplate> 

     <div id="divComnt" class="Dcomment span9" onmouseover="MouseOver_Comment()" onmouseout="MouseOut_Comment()"> 
       <div class="date" >Posted at <%#Eval("DateAdded")%></div> 
       <br/> 
       <p><%# Eval("Comment") %> </p> 
       <br/> 
       <%--reply buttons--%> 
       <div id="Div_replyLinks" class="bottom pull-left replyLink" style="margin:3px 1px 3px 1px"> 

       <a href="#" title="Katılıyorum"><i class=" icon-thumbs-up"></i> </a> 
       <a href="#" title="Katılmıyorum"><i class=" icon-thumbs-down"></i> </a> 
       <a href="#" title="Bence..."><i class="icon-comment"></i> </a> 

       </div> 
      </div> 
      </ItemTemplate> 

      </asp:Repeater>` 

這裏是JavaScript

function MouseOut_Comment() { 
     var div = document.getElementById("Div_replyLinks"); 
     div.style.visibility = 'hidden'; 
    } 
    function MouseOver_Comment() { 

     var div = document.getElementById("Div_replyLinks").; 
     div.style.visibility = 'visible'; 
    } 

這裏是link的視覺幫助。(很遺憾,我不能上傳圖片,由於缺乏信譽的) 正如您在圖片中看到的,活動評論div是第二個,但回覆按鈕圖標在第一個中可見。

回答

0

好的,我找到了解決問題的方法。我使用<%#Container.ItemIndex%>作爲我希望更改其可見性屬性的div的id值。然後發送<%#Container.ItemIndex%>從Java功能參數

下面是代碼

<asp:Repeater ID="RptComments" runat="server" > 

     <ItemTemplate> 

     <div id="DivComnt" class="Dcomment span9" onmouseover="MouseOver_Comment('<%#Container.ItemIndex%>')" onmouseout="MouseOut_Comment('<%#Container.ItemIndex%>')"> 
       <div class="date" >Posted at <%#Eval("DateAdded")%></div> 
       <br /> 
       <p style="margin:2px 5px 2px 5px"><%# Eval("Comment") %> </p> 
       <br /> 
       <%--reply buttons--%> 
       <div id="<%#Container.ItemIndex%>" class="bottom pull-right replyLink" style="margin:3px 1px 3px 1px"> 
       <a href="#" title="Katılıyorum"><i class=" icon-thumbs-up"></i></a> 
       <a href="#" title="Katılmıyorum"><i class=" icon-thumbs-down"></i></a> 
       <a href="#" title="Bence..."><i class="icon-comment"></i></a> 
       </div> 
      </div> 
      </ItemTemplate> 
      </asp:Repeater> 

這裏是Java代碼:

function MouseOver_Comment(id) { 
     var div = document.getElementById(id); 
     div.style.visibility = 'visible';    
    } 
    function MouseOut_Comment(id) { 
     var div = document.getElementById(id); 
     div.style.visibility = 'hidden'; 
    } 
相關問題