Question

我在Masterpage中有一个带有两个文本框的webform，我试图在将一些数据保存到数据库之前验证文本框。

如果我在一个简单的应用程序（如简单的Login）中测试Javascript代码，它就可以工作。但是当我将它用于我的应用程序时，我无法工作。它只是将空白空间保存到数据库中。

我不知道为什么JS代码不起作用，我不知道还能做什么。

这是我的部分网页代码：

    </head>
    <body>
        <form id="form1" class="contact-form text-right">

        <section class="contact-area" id="contact">
            <div class="container-fluid">
                <div class="row align-items-center d-flex justify-content-start">
                    <div class="col-lg-6 col-md-12 contact-left no-padding">
                        <div>
                             <%-- tabla aqui --%>
                            <table style="width: 100%;">
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                    <td>&nbsp;</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-12 pt-100 pb-100">

                            <asp:Label runat="server" ID="lblFecha" Text=""></asp:Label>
                            <asp:Label runat="server" ID="lblIDUsuario" visible="false" Text=""></asp:Label>
                            <asp:Label runat="server" ID="lblUsuario" Text=""></asp:Label>


                            <asp:TextBox ID="txtID" visible="true" class="common-input mt-10" type="numeric" readonly="false" runat="server"></asp:TextBox>
                            <asp:TextBox ID="txtTitulo" placeholder="Ingrese el título" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Ingrese el título'" class="common-input mt-10" type="text" runat="server"></asp:TextBox>
                            <textarea id="txtContenido" style="resize:none;" cols="20" rows="5" placeholder="Ingrese el contenido" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Ingrese el contenido'" class="common-input mt-10" type="text" runat="server"></textarea>

                            <asp:Button ID="btnGuardar" OnClientClick="return performCheck();" OnClick="btnGuardar_Click"  runat="server" Text="Guardar" class="primary-btn mt-20"></asp:Button>
                            <asp:Button ID="btnActualizar"  OnClientClick="return performCheck();" onClick="btnActualizar_Click" runat="server" Text="Actualizar" class="primary-btn mt-20"></asp:Button>
                        <asp:Label ID="lblError" runat="server" Text="" ForeColor="Red"></asp:Label>    
                        <div class="alert-msg">
                            </div>

                    </div>
                </div>
            </div>
        </section>
            </form>


        <script type="text/javascript">
            function performCheck() {
                if (document.getElementById("txtTitulo").value == '') {
                    alert(" Debe Ingresar un título");
                    return false;
                }

                if (document.getElementById("txtContenido").value == '') {
                    alert("Debe Ingresar un contenido");
                    return false;
                }

                return true;
            }
        </script>

        <script src="js/vendor/jquery-2.2.4.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
        <script src="js/vendor/bootstrap.min.js"></script>
        <script src="js/owl.carousel.min.js"></script>
        <script src="js/jquery.ajaxchimp.min.js"></script>
        <script src="js/jquery.sticky.js"></script>
        <script src="js/parallax.min.js"></script>
        <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBhOdIF3Y9382fqJYt5I_sswSrEw5eihAA"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        <script src="js/jquery.magnific-popup.min.js"></script>
        <script src="js/main.js"></script>

    </body>
</html>

这是我的JS代码：

<script type="text/javascript">
    function performCheck() {
        if (document.getElementById("txtTitulo").value == '') {
            alert(" Debe Ingresar un título");
            return false;
        }

        if (document.getElementById("txtContenido").value == '') {
            alert("Debe Ingresar un contenido");
            return false;
        }

        return true;
    }
</script>

Answer 1

请勿在点按处理程序的按钮上进行表单验证。在表单提交处理程序中执行它们。用户可以通过单击输入意外绕过验证来提交表单。可以在https://www.w3schools.com/js/js_validation.asp

找到一个示例

这是为什么只有客户端验证不充分的完美示例。如果提交的数据有效至关重要，则必须实现服务器端验证。无论是偶然还是故意，用户都可以轻松绕过任何客户端验证。

Javascript客户端验证不起作用ASP.Net

1 个答案: