忽略特定按钮单击时的javascript验证

Question

我有一个使用'jquery.validate.js'文件的jQuery验证页面。表单标记内有两个div，即runat= "server"。使用以下命令在表单上应用验证：

jQuery("#form1").validate();

验证javascript：

<script type="text/javascript" src="../Javascript/Validators/jquery.validate.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery("#form1").validate({
            rules: {
                txtLoginID: "required",
                txtUsername: "required",
                txtPassword: "required",
                txtConfirmPassword: "required",
                txtJobTitle: "required",
                txtAddress: "required",
                txtContact: {
                    required: true,
                    minlength: 10
                },
                txtEmail: {
                    required: true,
                    email: true
                }
            },
            messages: {
                txtLoginID: " * Please enter a strong login id",
                txtUsername: " * Please enter your username",
                txtPassword: " * Please enter your Password",
                txtConfirmPassword: " * Password mismatch",
                txtJobTitle: " * Please enter job title",
                txtAddress: " * Please enter your address",
                txtContact: " * Please enter a valid mobile number",
                txtEmail: " * Please enter a valid email address"
            }
        });
    }); 
</script>        

HTML：

（DIV 1）

                <table cellpadding="0" cellspacing="0" border="0" width="100%">
                    <tr>
                        <td align="left" style="padding: 5px" colspan="2">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Login ID
                        </td>
                        <td style="padding: 5px;">
                            <asp:UpdatePanel runat="server" ID="up2">
                                <ContentTemplate>
                                    <asp:TextBox ID="txtLoginID" CssClass="txtField" runat="server" OnTextChanged="txtLoginID_TextChanged"
                                        AutoPostBack="true"></asp:TextBox>
                                    <span id="spanAvailability" runat="server"></span>
                                </ContentTemplate>
                            </asp:UpdatePanel>
                        </td>
                    </tr>
                    <div id="UserSecurity" runat="server">
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Password
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtPassword" TextMode="Password" CssClass="txtField" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Confirm Password
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtConfirmPassword" TextMode="Password" CssClass="txtField" runat="server" equalTo="#txtPassword"></asp:TextBox>
                        </td>
                    </tr>
                    </div>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            User Name
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtUsername" CssClass="txtField" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Department
                        </td>
                        <td style="padding: 5px;">
                            <asp:DropDownList ID="ddlDepartments" runat="server" CssClass="ddlField"></asp:DropDownList>&nbsp;&nbsp;<a href='#' onclick='overlay()'>[ Add New Department ]</a>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Job Title
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtJobTitle" CssClass="txtField" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Address
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtAddress" TextMode="MultiLine" Rows="10" Columns="20" CssClass="txtField"
                                runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Contact Number
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtContact" CssClass="txtField" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Email Address
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtEmail" CssClass="txtField" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Online Contact (Chat)
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtChat" CssClass="txtField" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td align="left" style="padding: 5px" class="lblField">
                            Fax
                        </td>
                        <td style="padding: 5px;">
                            <asp:TextBox ID="txtFax" CssClass="txtField" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                    <tr style="padding-top: 20px;">
                        <td colspan="2" style="padding: 5px;">
                            <asp:Button ID="btn_Save" CssClass="btnField" runat="server" Text="SAVE" OnClick="btn_Save_Click" />
                            <asp:Button ID="btn_delete" runat="server" CssClass="btnField" Text="DELETE" OnClick="btn_delete_Click" />
                            <asp:Button ID="btn_reset" runat="server" CssClass="btnField" Text="RESET" OnClick="btn_reset_Click" />
                        </td>
                    </tr>
                </table>
            </div>              

DIV 2：

<script type="text/javascript">
    function overlay() {
        el = document.getElementById("overlay");
        el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
    }
</script>
<div id="overlay">
    <div>
        <a href="#" class="close"><a href='#' onclick='overlay()'>
            <img src="../Images/Icons/close_pop.png" class="btn_close" title="Close Window"
                alt="Close" /></a>
            <h2 style="float:left;padding-bottom:20px;">
                New Department</h2><br />
                <asp:Label ID="lblDeptMessage" runat="server" CssClass="errField"></asp:Label>
                <br />
            <asp:TextBox ID="txtNewDept" runat="server" CssClass="txtField"></asp:TextBox>&nbsp;&nbsp;<asp:Button ID="btnSaveDept" runat="server" Text="SAVE" CssClass="btnField" OnClick="btnSaveDept_Click" /></a>
    </div>
</div>            

现在我需要从此验证中释放第二个div的按钮。

问题是，当我单击第二个div中的asp:Button时，会出现验证，这会阻止操作发生。 CauseValidation="false"在这里不起作用。