【问题标题】:How to keep Jquery gridview hover-menu visible如何保持 Jquery gridview 悬停菜单可见
【发布时间】:2012-09-02 20:19:00
【问题描述】:

我正在网格视图上创建悬停菜单,但由于某些原因,我无法保持弹出窗口可见。当鼠标悬停在标签上时,弹出窗口会出现,但是当我在弹出窗口上移动它时,它不会保持可见。

            $('.label').mouseover(function(e) {
                $(e.target).closest("tr").find(".popup").show();
            });

            $('.label').mouseout(function(e) {
                $(e.target).closest("tr").find(".popup").hide();
            });

            $('.popup').mouseover(function(e) {
                $(e.target).show();
            });

            $('.popup').mouseout(function(e) {
                $(e.target).hide();
            });


<asp:TemplateField>
    <ItemTemplate>

        <asp:Label ID="label1" CssClass="label" runat="server" Text='<%# Eval("Column1") %>'></asp:Label>

            <asp:Panel runat="server" ID="popup" CssClass="popup" 
            Style="display: none; position: absolute; margin-left: 60px; width: 250px;">


                Random text

            </asp:Panel>

    </ItemTemplate>
</asp:TemplateField>

也许弹出窗口被隐藏了,因为即使鼠标在它上面,它也在标签之外?任何想法如何解决这个问题?

【问题讨论】:

    标签: c# jquery asp.net gridview


    【解决方案1】:
      $(document).ready(function () {
            $('.label').mouseover(function (e) {
                $(this).find(".popup").show();
            });
    
            $('.label').mouseout(function (e) {
                $(this).find(".popup").hide();
            });
      });
    

    【讨论】:

    • 运行项目,在浏览器中右键点击查看页面源代码。你可以为一个项目模板粘贴那个 html 代码吗?
    • 谢谢,我不得不在 $('.popup').mouseover(function()) 中将 $(e.target) 替换为 $(this),现在它可以正常工作了 :)跨度>
    猜你喜欢
    • 2015-01-29
    • 2011-07-08
    • 2011-02-06
    • 2017-10-29
    • 1970-01-01
    • 2021-11-16
    • 1970-01-01
    • 1970-01-01
    • 2020-05-10
    相关资源
    最近更新 更多