我是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;
很抱歉,如果我的编程语言(变量和消息)不是英语。 在if之前,我显示了消息变量的长度,但我应该输入if if more it not 。
答案 0 :(得分:1)
您的错误就在这一部分:
if(mensaje.length !=0){
document.getElementByClassName('msgerror').innerHTML = mensaje;
return false;
}
没有名为getElementByClassName
的功能。有一个名为getElementsByClassName
的函数(注意 getElement 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;彼此。
***********更新************* 尝试检查下面的行。插入if:
console.log ("success") //this line
document.getElementByClassName('msgerror')[0].innerHTML = mensaje;
你必须检查你是否有一个带有这个&#39; msgerror&#39;的元素。类。