HTML如何验证文本框是否已填充并将用户发送到另一个页面

debugcn 发表于 Dev

拉斐尔·阿格拉

我已经建立了一个登录页面，并且仅当HTML文本框和密码（包含任何内容）填充时，我才要将用户重定向到另一个html页面。

我的想法是仅使用HTML和Javascript来做到这一点（就我不需要php来发送数据而言）。

所以这是我的html，表单部分专门

<form name="frmTeste" onsubmit="return validaForm(this);">
            <fieldset id="usuario">
                <legend id="usuario" >Identificação do Usuário</legend>
                
                <p>Nº <input type="text" name="tNumero" id="tNumero" size="20" maxlength="15" placeholder="ID"> </p>

                <p><label for="cSenha" >Senha:</label> <input type="password" name="tSenha" id="cSenha" size="20" maxlength="12" placeholder="Senha" autocomplete="current-password"/> </p>
                    
                <input type="submit" id="botao" class="bt bt-acessar" value="Entrar" onclick="Nova(this)">

                <p>
                    Não possui uma conta? <a href="#" id="cadastrar" onclick="alert('Desculpe, ainda não é possível realizar cadastro')"> Cadastrar </a>
                </p>
            </fieldset>
        </form>

这是我的javascript

function validaForm(frm) {
        if(frm.tNumero.value == "" || frm.tNumero.value == null || frm.tNumero.value.lenght < 3) {
            
            alert("Por favor, indique o seu numero USP.");
            
            frm.nome.focus();
            return false;
        }else if(frm.cSenha.value == "" || frm.cSenha.value == null || frm.cSenha.value.lenght < 3){
            alert("Por favor, indique sua senha");

            frm.nome.focus();
            return false;
        }else{
            return true;
        }
    }
    function Nova(frm){
        if (validaForm(frm) == false){
            location.href = "index.html";
        }else if (validaForm(frm) == true){
            location.href = "notas.html";
        }

我尝试了许多不同的方法，但都没有成功。

博卡拉

我认为这就是您想要的。

你应该改变

<form name="frmTeste">
            <fieldset id="usuario">
                <legend id="usuario" >Identificação do Usuário</legend>
                
                <p>Nº <input type="text" name="tNumero" id="tNumero" size="20" maxlength="15" placeholder="ID"> </p>

                <p><label for="cSenha" >Senha:</label> <input type="password" name="tSenha" id="cSenha" size="20" maxlength="12" placeholder="Senha" autocomplete="current-password"/> </p>
                    
                <input type="submit" id="botao" class="bt bt-acessar" value="Entrar" onclick="validateForm(this)">

                <p>
                    Não possui uma conta? <a href="#" id="cadastrar" onclick="alert('Desculpe, ainda não é possível realizar cadastro')"> Cadastrar </a>
                </p>
            </fieldset>
        </form>

同时更改javascript

function validateForm(frm){
            window.event.preventDefault();
            frm = frm.parentNode.parentNode;
            var tNumero = document.getElementById("tNumero");
            var cSneha = document.getElementById("cSenha");
            if(tNumero.value.length < 3) {  
                alert("Por favor, indique o seu numero USP.");
                window.location.href = "/index.html";
            } else if(cSenha.value.length < 3){
                alert("Por favor, indique sua senha");
                window.location.href = "/index.html";
            }else{
               frm.setAttribute("action","/notas.html");
               frm.submit();
            }
        }

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。