返回false在我的javascript函数

时间:2017-01-31 03:39:26

标签: javascript html5

我是javascript的新手,我尝试使用javascript在onSubmit中验证我的表单,但它不起作用,好像它不会输入我的最后一个,如果我比较一个字符串的大小。始终返回true并结束发送表单因此存在输入问题



function validaDatos(form){
	var mensaje="";
	var solonumeros = /^([0-9])*$/
	var sololetras = /^([A-Z]|[a-z])*$/
	var doc = form.doc.value;
	var apepa = form.apepa.value;
	var apema = form.apema.value;
	var nombre = form.nombre.value;
	var telefono = form.telefono.value;
	var usuario = form.usuario.value;

	if(!solonumeros.test(doc)){
		mensaje+="Campo Documento erróneo, solo se aceptan Números";
	}
	if(!sololetras.test(apepa)){
		mensaje+="Campo Apellido Paterno erróneo, solo se aceptan Letras";
	}
	if(!sololetras.test(apema)){
		mensaje+="Campo Apellido Materno erróneo, solo se aceptan Letras";
	}
	if(!sololetras.test(nombre)){
		mensaje+="Campo Nombre erróneo, solo se aceptan Letras <br>";
	}
	if(!solonumeros.test(telefono)){
		mensaje+="Campo Teléfono, solo se aceptan Números ";
	}
	if(!solonumeros.test(usuario) && !sololetras.test(usuario)){
		mensaje+="Campo Usuario , Solo se Acepta Números y Letras";
	}
	alert(mensaje.length); //return > 0
    /* No compare , no return false */
	if(mensaje.length !=0){
		document.getElementByClassName('msgerror').innerHTML  = mensaje;
		return false;
	}
	
}
&#13;
<form action="Models/clsUsuario.php" method="POST" accept-charset="utf-8" id="frmRegistro" onsubmit="return validaDatos(this);">
<label for="">Documento </label>
<input type="text" id="doc" name="doc" required  maxlength="11">
<label for="">Apellido P.</label>
<input type="text" id="apepa" name="apepa" required  maxlength="80">
<label for="">Apellido M.</label>
<input type="text" id="apema" name="apema" required  maxlength="80">
<label for="">Nombres </label>
<input type="text" id="nombre" name="nombre" required  maxlength="80">
<label for="">Email : </label>
<input type="email" id="email" name="email" required>
<label for="">Teléfono : </label>
<input type="tel" id="telefono" name="telefono"  required>
<label for="">Usuario  </label>
<input type="text" id="usuario" name="usuario" required>
<label for="">Clave  </label>
<input type="password" id="clave" name="clave" required>

<label for="">Dirección : </label>
<textarea name="direccion" id="direccion" required></textarea>

<input type="hidden" name="registrar" value="registrar">
<input type="submit" name="registrar" value="Registro" >
<span class="msgerror"></span>
				
</form>
&#13;
&#13;
&#13;

很抱歉,如果我的编程语言(变量和消息)不是英语。 在if之前,我显示了消息变量的长度,但我应该输入if if more it not

Code Run

3 个答案:

答案 0 :(得分:1)

您的错误就在这一部分:

if(mensaje.length !=0){
    document.getElementByClassName('msgerror').innerHTML  = mensaje;
    return false;
}

没有名为getElementByClassName的功能。有一个名为getElementsByClassName的函数(注意 getElement s > 中缺少的 s ,并且它将始终返回一个数组:它没有匹配的元素,数组将为空)

在Chrome中,您可以查看开发人员工具中的Preseve Log,以使浏览器在页面加载之间保留日志。

您现在没有看到任何内容的原因是错误会导致函数中止,并且由于表单不会返回false,因此表单将被提交。

我还注意到你通过连接字符串设置了几个不同的错误消息。如果有多个错误,这会让您遇到麻烦,例如,您可以获得"Campo Documento erróneo, solo se aceptan NúmerosCampo Apellido Paterno erróneo, solo se aceptan Letras"(注意NúmerosCampo之间缺少一个分隔符)。我建议使用数组,然后在使用时将其与分隔符连接。

function validaDatos(form){
  var mensaje=[];

  // get the element where to set errors. It would be better to use
  // getElementById, but if you don't have an id on the element, that will
  // obviously not work. 
  var errorElement = document.getElementsByClassName("msgerror")[0];
  var solonumeros = /^([0-9])*$/
  var sololetras = /^([A-Z]|[a-z])*$/
  var doc = form.doc.value;
  var apepa = form.apepa.value;
  var apema = form.apema.value;
  var nombre = form.nombre.value;
  var telefono = form.telefono.value;
  var usuario = form.usuario.value;

  if(!solonumeros.test(doc)){
    mensaje.push("Campo Documento erróneo, solo se aceptan Números");
  }
  if(!sololetras.test(apepa)){
    mensaje.push("Campo Apellido Paterno erróneo, solo se aceptan Letras");
  }
  if(!sololetras.test(apema)){
    mensaje.push("Campo Apellido Materno erróneo, solo se aceptan Letras");
  }
  if(!sololetras.test(nombre)){
    mensaje.push("Campo Nombre erróneo, solo se aceptan Letras");
  }
  if(!solonumeros.test(telefono)){
    mensaje.push("Campo Teléfono, solo se aceptan Números");
  }
  if(!solonumeros.test(usuario) && !sololetras.test(usuario)){
    mensaje.push("Campo Usuario , Solo se Acepta Números y Letras");
  }
  console.log(mensaje.length); //return > 0
    /* No compare , no return false */

  // test if there is an error (the length is not null) and if the
  // errorElement exists.
  if(mensaje.length && errorElement){
    errorElement.innerHTML = mensaje.join("<br>");
  }

  // returns true if the length is 0, or false if it is any other value.
  return mensaje.length === 0;
}

答案 1 :(得分:0)

你必须从if语句中返回一些内容。

试试这个:

function validaDatos(form){
var mensaje="";
var solonumeros = /^([0-9])*$/
var sololetras = /^([A-Z]|[a-z])*$/
var doc = form.doc.value;
var apepa = form.apepa.value;
var apema = form.apema.value;
var nombre = form.nombre.value;
var telefono = form.telefono.value;
var usuario = form.usuario.value;

if(!solonumeros.test(doc)){
    mensaje+="Campo Documento erróneo, solo se aceptan Números";
}
if(!sololetras.test(apepa)){
    mensaje+="Campo Apellido Paterno erróneo, solo se aceptan Letras";
}
if(!sololetras.test(apema)){
    mensaje+="Campo Apellido Materno erróneo, solo se aceptan Letras";
}
if(!sololetras.test(nombre)){
    mensaje+="Campo Nombre erróneo, solo se aceptan Letras <br>";
}
if(!solonumeros.test(telefono)){
    mensaje+="Campo Teléfono, solo se aceptan Números ";
}
if(!solonumeros.test(usuario) && !sololetras.test(usuario)){
    mensaje+="Campo Usuario , Solo se Acepta Números y Letras";
}

/* No compare , no return false */
if(mensaje.length !=0){
    document.getElementByClassName('msgerror').innerHTML  = mensaje;
    return false;
}
return true;

}

答案 2 :(得分:0)

尝试使用:

if(mensaje.length !==0){ //two equals sign
    document.getElementByClassName('msgerror').innerHTML  = mensaje;
    return false;
}

您还可以使用以下函数检查字符串是否为空,null或未定义:

function isEmpty(str) {
    return (!str || 0 === str.length);
}

了解= vs ==:

之间的区别
  

比较的特点:

     

两个字符串具有相同的序列时严格相等   相应的字符,相同的长度和相同的字符   位置。   两个数字在数字上严格相等   相等(具有相同的数值)。   NaN不等于任何东西,   包括NaN。   正负零彼此相等。   如果两个布尔操作数都为真或两者都是严格相等,则它们是严格相等   假。   对于strict或者,两个不同的对象永远不会相等   抽象比较。   比较Objects的表达式仅在操作数引用时才为true   相同的对象。   空和未定义类型严格等于它们自己并且抽象地等于&gt;彼此。

     

Comparison operator

***********更新************* 尝试检查下面的行。插入if:

console.log ("success") //this line
document.getElementByClassName('msgerror')[0].innerHTML  = mensaje;

你必须检查你是否有一个带有这个&#39; msgerror&#39;的元素。类。