Мне нужна помощь по некоторым вопросам, которые я хочу уладить некоторые проблемы с использованием javascript. Я использовал gridview для отображения всех моих комментариев, сохраненных в базе данных. То, что я хочу, - это когда пользователь наводит мышь на каждый комментарий, он выделяет фон, который уже решил, и хочет показать один из элементов div прямо там с помощью кнопки закрытия и получить текстовое значение одного элемента управления меткой внутри элемента во время события mouseover, Получив текстовое значение этого ярлыка во время onmouseover, я хочу отобразить его в другом элементе div, и я хочу получить текстовое значение другого элемента управления меткой, который находится вне gridview во время события onmouseover. Ниже приведена подробная информация:
HTML-макет:
<asp:Label ID="Label4" runat="server" Text=' <%#Eval("ID") %>'></asp:Label> //I want to get the text value of this control
<div id="test"></div> //here I want to put the text value of the name label control after getting it during onmouseover
<div id="Username" style =" margin-left :100px; width :1000px">
<asp:GridView ID="gvParentGrid" runat="server" Width="395px"
AutoGenerateColumns="false" GridLines="None" BorderStyle="Solid" BorderWidth="0px"
BorderColor="White" DataKeyNames="ID" onrowcommand="gvParentGrid_RowCommand"
onrowdatabound="gvParentGrid_RowDataBound" >
<Columns>
<asp:TemplateField >
<ItemTemplate>
<tr >
<td id ="comment" onmouseover="highlightBG(this, '#C0C0C0');highlightNext(this, 'black')" onmouseout="highlightBG(this, 'white');highlightClear()" class ="highlightab" style ="border-bottom :2px solid Blue;border-bottom-color :Gray; border-left :0px; border-left-color :White; border-right :0px; border-right-color :White; border-top :0px; border-top-color :White;background-color :White;border-bottom :2px solid Blue;border-bottom-color :Gray; border-left :0px; border-left-color :White; border-right :0px; border-right-color :White; border-top :0px; border-top-color :White;background-color :White; height :100px; width :395px; margin-bottom :5px">
<div id ="Close" style="display :none" ><asp:Button ID="Button3" runat="server" Text="X" style =" cursor:pointer; margin-left :365px; border:0px; background-color :White; color :blue; font-weight :bold; " /></div>
<br />
<asp:Image ID="Image1" runat="server" style=" margin-right :5px; background-image :url('Image/imagebackground.png');" ImageAlign ="Left" Height ="60px" Width="60px" />
<asp:Label ID ="ComID" runat ="server" style="display :none" Text =' <%#Eval("ID") %>' />
<asp:Label ID="name" runat="server" style="font-weight :bolder; color :Blue; " Text='<%# Eval("Name")%>' ></asp:Label> // I want to get this value diplay it in the div test
<p id ="content" class="minimize" style =" border-radius: 4px 4px 4px 4px; max-width :395px; min-height :5px; margin-top :5px; margin-bottom :5px; margin-left :65px; display :block; background-color: #CCCCFF;"> <%# DataBinder.Eval(Container.DataItem,"Comments").ToString() %> </p>
<a href="JavaScript:divexpandcollapse('div<%# Eval("ID") %>');" style ="margin-left :65px; margin-top :1px" >
<input id="btndiv<%# Eval("ID") %>" type="button" value="Reply" style ="border:0px; background-color :White; color :blue; cursor :pointer " />
</a>
</td>
</tr>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
Javascript:
function highlightBG(element, color) {
element.style.backgroundColor = color;
var getval = document.getElementById("commentor").innerHTML;
document.getElementById("test").innerHTML = getval;
document.getElementById("Close").style.display ="block";
}
Сводка для устранения некоторых проблем.
Мне нужно, чтобы Close div отображался в каждой строке gridview, когда наведите курсор, потому что теперь, используя этот код выше, будет отображаться только Close div в первой строке, но если вы переместите мышь в другую строку, строка Close div по-прежнему будет отображаться на первая строка, которая должна была переноситься или показывать в другой строке при перемещении мыши в другую строку.
Мне нужно получить текстовое значение метки имени, которое находится внутри элемента gridview и отображать его в тесте div во время зависания.
Мне нужно получить текстовое значение Label4, которое находится вне gridview во время onmouseover.
Спасибо за любую помощь... Надеюсь, кто-то сможет помочь мне завязать эти 3 вопроса.
Человек, это кажется очень сложным. Мне может потребоваться, чтобы вы нарисовали картину. Лол. Из того, что я собираю:
Во-первых, у вас не должно быть нескольких элементов с одинаковым идентификатором. Изменить (id = "Закрыть") на (class="Закрыть").
jQuery был бы классным для такого рода запросов dom.
1)
function highlightNext(){
var highlightNext = document.getElementsByClassName('highlightNext');
for(var i = 0; i < highlightNext.length; i++){
highlightNext[i].style.display = 'none';
}
}
2)
function highlightBG(element, color) {
element.style.backgroundColor = color;
//Instead of querying for "Close"
var Close = element.children[0];
Close.style.display = "block";
var getval = Close.innerHTML;
document.getElementById("test").innerHTML = getval;
}
3) Измените ярлык, чтобы получить статический идентификатор
<asp:Label ID="Label4" runat="server" Text='<%# Eval("ID") %>' ClientIDMode="Static"></asp:Label>
Запросите ярлык с тем, что вы уже знаете:
document.getElementById("Label4");