1

Hidden DIV 内にログイン FORM があります。この DIV は、display:none;他の DIV をクリックすると CSS を使用して非表示になります。jquery を使用してこの DIV を表示する.slideDown()ので、このフォームを使用できます。

ボタンをクリックしてもOnClick="Login"機能しないようで、この非表示の div からこのフォームを本体の別の場所に削除すると、機能しました。どうしたの？

ASP.NET:

<div id="userCPContainer">
<form id="loginForm" runat="server">
    <asp:Label ID="Label1" runat="server" Text="Username" class="loginLabels"></asp:Label>
    <br />
    <asp:TextBox ID="usernameField" runat="server" MaxLength="50" class="loginFields"></asp:TextBox>
    <asp:Label ID="Label2" runat="server" Text="Password" class="loginLabels"></asp:Label>
    <br />
    <asp:TextBox ID="passwordField" runat="server" MaxLength="50" 
        TextMode="Password" class="loginFields"></asp:TextBox>


    <asp:Button ID="loginButton" runat="server" Text="Log in" onclick="Loginn" class="loginButton"/>
</form>
</div>

Jクエリ:

function showUserCP() {

    $("#userCPContainer").slideDown(200);
    $(".userCPDiv").css("background-color", "#000000");
    $(".userCPDiv").css("border-color", "#000000");
}

function hideUserCP() {
    $(".userCPDiv").css("background-color", "rgb(43, 147, 206)");
    $(".userCPDiv").css("border-color", "rgb(43, 147, 206)");
    $("#userCPContainer").slideUp(200);

}

$(".userCPDiv").click(function (e) {
        //Either way, hide Main Menu
        hideMainMenu();
        if ($("#userCPContainer").is(":visible")) {
            hideUserCP();
        }
        else {
            showUserCP();
        }
        e.stopPropagation();

    });

CSS:

#userCPContainer
{
    overflow:hidden;
    border-style:solid;
    border-top-style:none;
    border-color:rgb(43,147,206);
    border-width:2px;
    position:absolute;
    right:0px;
    top:0px;
    display:none;
    z-index:1;
    width:300px;
    background-color:  #000000;
}

本当に複雑なことは何もありません...

4

1 に答える 1

1

CSS を使用する場合display: none;の問題は、その DIV 内のすべてが HTML ドキュメントから完全に削除され、jQuery を介して表示するときに ASP.NET がこの要素を認識しないことです。私は可能な解決策を見ます：

  1. visibility: hiddenの代わりに使用display: none;します。これを行うと、レンダリングに必要なスペースが必要になりますが表示されないため、DIV の高さに問題が発生する可能性があります。
  2. aScriptManagerと anUpdatePanelを使用して div とフォームをこれらの要素内に配置すると、サーバーはクライアントでボタンをいつレンダリングするかを認識します。また、jQuery スクリプトをScriptManager

これがお役に立てば幸いです

于 2012-12-23T05:09:22.367 に答える