3

JavaScript でパネルが表示されているかどうかを確認するにはどうすればよいですか? ASP.NET 2.0 を使用しています。

4

5 に答える 5

9

サーバー側でパネルの可視性を設定していると仮定するとdocument.getElementById()、パネル コントロールの正しいクライアント ID を使用していることを確認すれば (ハードコードしないでください)、 によって返される値のチェックが機能します。 .

findPanel()デモンストレーションについては、クライアント側関数のチェックを参照してください。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function findPanel() {
            var panel = document.getElementById("<%= pnlMyPanel.ClientID %>");
            if (panel) {
                alert("Panel is visible");
            }
            else {
                alert("Panel is not visible");
            }

//        // And this would work too:
//        alert((<%= pnlMyPanel.Visible.ToString().ToLower() %>) ? "Panel is visible": "Panel is not visible");

        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Panel runat="server" ID="pnlMyPanel">
            <p>
                This is a panel.</p>
        </asp:Panel>
        <asp:Button runat="server" ID="btnToggle" Text="Toggle panel visibility..." />
        <input type="button" value="Do client-side visibility check..." onclick="javascript:findPanel();" />
    </div>
    </form>
</body>
</html>

コード ビハインド ファイル内の次のコードは、btnToggleがクリックされたときにパネルの表示を切り替えます。

protected void Page_Load(object sender, EventArgs e)
{
    btnToggle.Click += new EventHandler(btnToggle_Click);
}

void btnToggle_Click(object sender, EventArgs e)
{
    pnlMyPanel.Visible = !pnlMyPanel.Visible;
}
于 2012-05-07T05:45:12.630 に答える
3

jQueryを使用している場合-試したことはありvisible selectorますか？

例えば：

if ($("#test").filter(":visible")​​​​​​​​.length > 0) {
    /* visible */
} else {
    /* invisible */
}

これは、パネルがサーバー側で非表示になっている場合、およびjQuery（エフェクト/トランジションなど）がパネルを起動して非表示にしている場合にも機能します。確認するexistsか、getElementById何かが返されるかどうかはわかりません。

必ずクライアント側IDをJavaScriptに挿入してから、を確認し:visibleてください。これにより、ルックアップが高速に保たれます。ドキュメント：

：visibleはjQuery拡張機能であり、CSS仕様の一部ではないため、を使用するクエリは、ネイティブDOMメソッド:visibleによって提供されるパフォーマンスの向上を利用できません。querySelectorAll()を使用して要素を選択するときに最高のパフォーマンスを実現するには:visible、最初に純粋なCSSセレクターを使用して要素を選択し、次にを使用します.filter(":visible")。

于 2012-05-07T05:38:51.817 に答える
3

簡単な方法は、現在表示されている値を ASP.NET から JavaScript に直接渡すことです。

<script type="text/javascript>
   function IsPanelVisible() {
      return <%= pnlMessages.Visible.ToString().ToLower() %>
   }
</script>
于 2012-05-07T05:58:58.313 に答える
1

パネルはサーバーサイドコントロールです。表示される値がtrueの場合、ページソースに同じIDのdivが表示されます。表示される値がfalseの場合、そのパネル部分はクライアントブラウザにまったく送信されません。

達成する1つの方法は、javascriptでそのIDを確認することです。jqueryでは、if（$（ "＃mypanel"）。exists（））がチェックできます。javascriptで、これをチェックしてください要素が表示されているDOMに存在するかどうかを確認する方法は？

于 2012-05-07T05:37:57.797 に答える
1

プロパティが falseの場合Visible、クライアントにはまったく送信されません (非表示であっても)。ASP.NET はそれをサーバー側で実行します。したがって、 を使用して検索するだけでdocument.getElementById(<%= panel.ClientID %>)、結果が空の場合は表示されません。

于 2012-05-07T05:30:06.307 に答える