时间戳

首页 > 解决方案 > 检查表格而不提交？

javascript - 检查表格而不提交？

问题描述

所以我有一页是register.php。此页面包含注册用户所需的不同信息的 3 个组成部分。这些组件使用 Jquery 隐藏和显示。只有第一个组件具有注册所需的信息，但注册/提交按钮位于第三个组件上。

我想要的是检查第一个组件上的表单，以防它为空/不正确，不允许用户移动到第二个组件。如果不提交表格，我怎么能做到这一点？我尝试调用如下所示的函数，但它不起作用，因为它没有正确检索信息。

function checkform(form){
    if(this.name.value == '' && this.email.value == '' && this.phone.value == '' && this.email.value == '' && this.password.value == '' && this.pasword_conf.value == ''){
        if (this.password.value == this.password_conf.value){
            if (this.password.value > 8){
                $("div.component1").hide();
                $("div.component2").show();
            }else{
                alert("La contraseña debe ser mayor a 8");
            }
        }else{  
            alert("Las contraseñas deben ser iguales");
        }
    }else{
        alert("Por favor, complete todos los espacios");
    }
}

我在互联网上找到了一些使用 AJAX 的示例，但其中大多数都检查了表单然后自动提交，这不是我想要的。

编辑：这是 HTML。

  <form action='register.php' method='POST' id='user-information'>
    <input type='text' class='form-control' placeholder='Nombre' name='name' id='name'/>
    <input type='text' class='form-control' placeholder='Correo' name='email' id='email'/>
    <input type='text' class='form-control' placeholder='Teléfono' name='phone' id='phone'/>
    <input type='password' class='form-control' placeholder='Contraseña' name='password' id='password'/>
    <input type='password' class='form-control' placeholder='Confirma contraseña' name='password_conf' id='password_conf'/>

  <button type='button' id='next-register' onclick='checkform(this.form)'>
    Siguiente
  </button>

  </form>

标签： javascriptphphtmljqueryajax

解决方案

使用 JQuery 验证插件。这将非常有用，您可以在提交之前验证表单，并且非常易于使用。

推荐阅读