Question

我正在尝试使用标签显示何时将鼠标悬停在“输入”字段上。这是我的表格的样子。

enter image description here

这是我的HTML：

            <div class="loginbox">
            <div class="box">
                <input runat="server" id="txt_clientrefmock2" class="logintextbox" placeholder="Client Ref" type="text" />
                <input runat="server" id="txt_postcodemock2" class="logintextbox" placeholder="Postcode" type="text" />
                <asp:TextBox runat="server" ID="txt_dateofbirth" CssClass="logintextbox" />
                <AjaxControlToolkit:MaskedEditExtender ID="MaskedEditExtender1" runat="server" TargetControlID="txt_dateofbirth" Mask="99/99/9999" />
            </div>

        </div>
        <div class="button">
            <div class="btnlogin">
                <asp:Button ID="btnLogin" runat="server" Text="Log in" CssClass="loginButton" OnClick="btnLogin_Click" />
            </div>
            <div class="messages">
                <asp:Label runat="server" Text="Please contact 88888 888 888 if you cannot find your client reference" ID="message" Visible="false" />
            </div>
        </div>

我想要发生的是当它们悬停在客户参考框上，然后我的标签变为可见。

我尝试过这样的代码（这不起作用）：

    <script>
        $(".txt_clientrefmock2").hover(
          function () {
              $("#message").show();
          },
          function () {
              $("#message").hide();
          }
        );
    </script>

编辑

我发现了导致另一个类似问题的问题。

当我从标签中取出“Visable = False”并运行代码时，它工作正常。

那么我怎样才能在Page_Load上隐藏标签？

Answer 1

当您使用ASP.NET并且txt_clientrefmock2是服务器控件时，您需要使用Control.ClientID并且您正在使用ID，因此您需要使用#作为ID选择器。

<%= txt_clientrefmock2.ClientID %>将获取ASP.NET生成的HTML标记的控件ID。

使用

$("#<%= txt_clientrefmock2.ClientID %>").hover(function() {
    $(".message").show(); //Here Message is a class so you need to use .
}, function() {
    $(".message").hide();
});

Answer 2

在您的代码txt_clientrefmock2中，ID不是class。更新您的代码，如下所示。

    $("#txt_clientrefmock2").hover(
      function () {
          $("#message").show();
      },
      function () {
          $("#message").hide();
      }
    );

Answer 3

回答我自己的问题，因为我只是想通过一些评论。

当@James Thorpe在页面呈现时提到ID更改时，我从标签中取出“Visable = False”并运行我的代码。

当我在输入上方盘旋时，它会起作用。

我替换了

Visable=False

使用

style="display:none;"

然后工作了。感谢您对此情况的所有帮助。

Answer 4

做Visible = false不会隐藏那个东西。隐藏任何东西都是通过display：none来完成的。如果你正在做Visible = false，那么那件事就会出现在那里，但实际上并没有被看到。只是你做了它的可见性，而不是隐藏它。当然，你在语法中错误地使用了id和类。

JQuery在输入悬停时显示标签

4 个答案: