检查 ASP Label 在不同页面上是否可见？

Question

我正在处理的当前代码一团糟。 目前，我有一个 aspx 页面，其中包含一些 javascript 并为 ascx 页面（不是当前的 aspx）上的各种 asp:buttons 设置工具提示。 它看起来像这样：

function setTooltips() {
$("[id*='btnSave']").mousemove(function (ev) { ButtonToolTip(ev, this, "Click to save"); });
$("[id*='btnClear']").mousemove(function (ev) { ButtonToolTip(ev, this, "Clear fields"); });
// more button tooltips set.
}

在ascx页面中，我还有一个asp:label。 我正在创建一个 javascript 方法来根据此 label 的可见性显示警报。我在查找控件及其可见性时遇到了问题。

这是 asp label 代码的样子：

<asp:UpdatePanel runat="server" ID="upnl_alert" UpdateMode="Always">
  <ContentTemplate>
    <asp:Label ID="lbl_alert" runat="server" Text="There are several issues found.<br /><br />" Visible="false" />
  </ContentTemplate>
</asp:UpdatePanel>

有没有办法检查 asp label 的可见性，以便我可以实现我刚刚为警报编写的 function？

我努力了：

if (document.getElementById('lbl_alert').style.visibility == "visible")

但我收到 DOM 异常 - 无法执行。

先谢谢您的帮助。

Answer 1

有一个包含一些 javascript 的 aspx 页面，并为 ascx 页面（不是当前的 aspx）上的各种 asp:buttons 设置工具提示。

好吧，不完全是。 这里的上下文很重要。

任何构建并放入任何页面的“用户”控件？

标记、控件和 javascript 以及 ascx 控件具有的其他内容？ 它放置在您现有的 aspx 页面中。 所以，不，控件不在其他页面中。

比 state 更好，您将用户控件放入现有页面，因此我想选择/使用/享受/隐藏/显示或对用户控件具有的某些按钮执行任何操作。

与所有页面一样，大多数控件通常会收到当前页面 class 或名称空间作为前缀。 请记住，如果将该用户控件拖到现有页面中 2 或 4 次会发生什么情况？ 那么按钮“id”变成了什么？ 我的意思是，按钮不能有相同的 id，但是多次放入用户控件是完全合法的，并且每次，它都会拉入该标记的当前页面。

所以，假设一个超级简单的用户控件（ascx）是这样的：

此 UC 的隐藏代码（单击按钮）

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

End Sub

Protected Sub Button1_Click(sender As Object, e As EventArgs)

    Me.Label1.Text =
    $"control id = {Me.ClientID} <br/>
    Button ID = {Button1.ClientID} <br/>
    LableID = {Label1.ClientID}"

End Sub

好的，现在让我们创建一个新的空白页面，然后在上面拖放。

我们现在有这个：

<uc1:UserButton runat="server" id="UserButton" />
<br />
<br />
<uc1:UserButton runat="server" id="UserButton1" />
<br />
<asp:Button ID="Button1" runat="server" Text="JavaScript - get Label 1"
    OnClientClick="gettest();return false"               
    />

<script>
    function gettest() {

        // var sLbl = '<%=UserButton.ClientID + "_Label1" %>'
        var sLbl = 'UserButton_Label1'

        var lbl1 = document.getElementById(sLbl)

        sResult = "Value of label1 in control is \n" + lbl1.innerText

        alert(sResult)

    }

</script>

那么，自从我两次掉进 UC 之后？

那么如何将标签和按钮分开呢？

简单的：

每个控件“内部”的控件都以您为用户控件提供的“id”为前缀，然后是“_”，然后是内部控件。

所以，注意关闭我使用的js代码：

// var sLbl = '<%=UserButton.ClientID + "_Label1" %>'
var sLbl = 'UserButton_Label1'

var lbl1 = document.getElementById(sLbl)

sResult = "Value of label1 in control is \n" + lbl1.innerText

alert(sResult)

所以，当我运行上面的命令时，我得到了这个：

因此，您需要在 ascx 页面内为您想要的控件加上当前页面中使用的控件名称的“id”作为前缀！

这就是为什么我在这里声明上下文很重要。 ASCX 页面无关紧要，重要的是当前页面上使用的“UC”控件的名称，因为当将此类控件拖放到现有页面时，该 UC 控件的控件以“id”为前缀" 的用户控件。

所以，要明确：

控件不在其他页面中，这实际上只是设计时的一个考虑和视图。

在运行时，这些 ascx 控件被拉取 + 注入 + 呈现在当前页面中。 因此，您可以/必须在该 ascx 页面中的控件前面加上 UC 控件的“id”，该控件在“拖放”该控件到您喜欢的任何 web 页面时使用。

用户控件很棒，因为它们代表可重复使用的控件，但最终，此类控件会呈现在当前页面中。