回发后点击功能

时间:2017-04-02 21:47:24

标签: javascript asp.net

你好我正在使用javascript处理一个简单的项目,我试图在页面从服务器发回后触发点击事件,我似乎无法弄清楚如何做到这一点。这是我的代码

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    <style type="text/css">
        .SignUp
        {
            padding-right: 450px;
            padding-left: 25px;
            margin-top: 100px;
        }
        .auto-style1 
        {
            color: #FFFFFF;
        }
        .auto-style2
        {
            text-align: left;
        }
        .auto-style3 
        {
            color: #FFFFFF;
            width: 158px;
        }
        .Message
        {
            margin-left: 100px;
            margin-top: 75px;
        }
        </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <h1>Sign Up for an Account:</h1>
    <div class="SignUp">
        <table class="auto-style1">
            <tr>
                <td class="auto-style3">First Name</td>
                <td class="auto-style2">
                    <asp:TextBox ID="FirstName" Class="FirstName" runat="server" style="margin-left: 0px"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="Firstname" ErrorMessage="Please Enter First Name" ForeColor="Red">*</asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style3">Last Name</td>
                <td class="auto-style2">
                    <asp:TextBox ID="LastName" class="LastName" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Please Enter Last Name" ForeColor="Red" ControlToValidate="LastName">*</asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style3">Password</td>
                <td class="auto-style2">
                    <asp:TextBox ID="Password" class="Password" runat="server" ></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Please Create a Password" ForeColor="Red" ControlToValidate="Password">*</asp:RequiredFieldValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style3">Confirm Password</td>
                <td class="auto-style2">
                    <asp:TextBox ID="ConfirmPassword" class="ConfirmPassword" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ErrorMessage="Please Confirm Password" ForeColor="Red" ControlToValidate="ConfirmPassword">*</asp:RequiredFieldValidator>
                    <asp:CompareValidator ID="CompareValidator2" runat="server" ControlToCompare="Password" ControlToValidate="ConfirmPassword" ErrorMessage="Passwords must Match" ForeColor="Red">*</asp:CompareValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style3">Email</td>
                <td class="auto-style2">
                    <asp:TextBox ID="Email" class="Email" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="Email" ErrorMessage="Please enter an Email" ForeColor="Red">*</asp:RequiredFieldValidator>
                     <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="Email" ErrorMessage="Please Enter a valid Email" ForeColor="Red" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">*</asp:RegularExpressionValidator>
                </td>
            </tr>
            <tr>
                <td class="auto-style3">ConfirmEmail</td>
                <td class="auto-style2">
                    <asp:TextBox ID="ConfirmEmail" class="ConfirmEmail" runat="server"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="ConfirmEmail" ErrorMessage="Please confirm Email" ForeColor="Red">*</asp:RequiredFieldValidator>
                    <asp:CompareValidator ID="CompareValidator1" runat="server" ControlToCompare="Email" ControlToValidate="ConfirmEmail" ErrorMessage="Emails must Match" ForeColor="Red">*</asp:CompareValidator>
                </td>
            </tr>
        </table>
   </div>
    <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <asp:Button ID="CreateAccount" Class="CreateAccount" runat="server" Text="Create Account" OnClick="SignUp_Click" />
    <br />
    <asp:Label  ID="Message" class="Message" runat="server" BackColor="Black" Font-Bold="True" Font-Size="30px" ForeColor="Red" Text="You have successfully created an Account" Height="30px" Visible="false"></asp:Label>
    <br />
    <br />
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:portfoliobrownConnectionString2 %>" SelectCommand="SELECT [id], [FirstName], [LastName], [Password], [ConfirmPassword], [ConfirmEmail], [Email] FROM [SignUP]"></asp:SqlDataSource>
    <br />
    <asp:ValidationSummary ID="ValidationSummary1" runat="server" ForeColor="Red" />
   <script type="text/javascript">
       $(".CreateAccount").click(function () {
           var first = document.getElementsByClassName("FirstName")
           var last = document.getElementsByClassName("LastName")
           var pass = document.getElementsByClassName("Password")
           var ConPass = document.getElementsByClassName("ConrirmPassword")
           var Email = document.getElementsByClassName("Email")
           var conEmail = document.getElementsByClassName("ConfirmEmail")
               if(first.length > 0 && last.length > 0 && pass.length > 0 && conPass.length > 0 &&
                   Email.length > 0 && conEnail.length > 0)
               {
                    alert("ehb");  
               }

           });

所以基本上我希望在单击按钮创建帐户后触发警报方法,但仅当页面从服务器回发时才会触发。

谢谢,任何帮助将不胜感激

2 个答案:

答案 0 :(得分:0)

您必须检查输入是否为空。给你的输入元素id标签如下:

<input id="username" ...
<input id="password" ...

然后在JS中以逻辑方式检查它们。

<script>
    function button_onclick(){
         var name = document.getElementById('<%= username.ClientID %>').value;
         var passw = document.getElementById('<%= password.ClientID %>').value;
         if(name.length > 0 && passw.length > 0){
            alert("Fields are not empty!");
         }
    }
</script>

答案 1 :(得分:0)

您可以使用RegisterStartupScript。创建一个处理警报的javascript函数。

<script type="text/javascript">
    function showAlert(msg) {
        alert(msg);
    }
</script>

然后从后面的代码调用该函数。

protected void Button1_Click(object sender, EventArgs e)
{
    string message = "Place message here";
    ScriptManager.RegisterStartupScript(Page, Page.GetType(), "showAlert", "showAlert('" + message + "')", true);
}