Red de conocimiento informático - Aprendizaje de programación - Metaprogramación

Metaprogramación

Brindarle una poderosa verificación de JAVAScript.

============================

& lttitle & gt terry. Validador de validación de formulario

& ltstyle & gt

cuerpo, TD { font:normal 12px Verdana color: #333333}

entrada, área de texto, selección, TD { fuente: normal 12px Verdana; color: #333333; borde: 1px sólido #999999; fondo: #ffffff}

tabla { border-collapse:collapse;}

td{ padding :3px}

Entrada {height:20;}

textarea {width:80%; height:50pxoverfmin:auto;}

Formulario {display: inline }

& lt/style & gt;

& lttable align="center " >

& ltform nombre = " el formulario " id = " demostración " action = " " método = " get " onSubmit = " return Validador.

Validar(esto, 2)" & gt;

& lttr & gt

& lttd & gtNombre real:& lt/TD & gt;

& lt /tr & gt;

& lttr & gt

& lttd & gt Nombre en inglés: & lt/TD & gt;

& lt/tr & gt ;

& lttr & gt

& lttd & gtPágina de inicio:

& lt/tr & gt;

& lttr & gt

& lttd & gtContraseña:

& lt/tr & gt;

& lttr & gt

& lttd & gtDuplicar:

& lt/tr & gt;

& lttr & gt

& lttd & gtE-mail: & lt/TD & gt;

& lt/tr & gt;

& lttr & gt

& lttd & gtCorreo electrónico: & lt/TD & gt;

& lt /tr & gt;

& lttr & gt

& lttd & gtQQ:& lt;/TD & gt;& lttd & gt& ltinput name = " QQ " require = " false " tipo de datos = " QQ " msg = " El número QQ no existe " > & lt/TD & gt

& lt/tr & gt;

& lttd & gtDNI: & lt/TD & gt;

& lt/tr & gt;

& lttr & gt

<td>age:

</tr>

<tr>

<td>age1:</TD & gt;

& lt/tr & gt;

& lttr & gt

& lttd & gtTeléfono:& lt/TD & gt;

p>

& lt/tr & gt;

& lttr & gt

& lttd & gtTeléfono móvil:& lt/TD & gt;

& lt/tr & gt;

& lttr & gt

& lttd & gtCumpleaños: & lt/TD & gt;

& lt/tr & gt;

& lttr & gt

& lttd & gtCódigo postal:& lt/TD & gt;

& lt/tr & gt;

p>

& lttr & gt

& lttd & gtCódigo postal:& lt/TD & gt;

& lt/tr & gt;

& lttr & gt

& lttd & gtSistema operativo:& ltOpción value = " " & gtSeleccione su sistema operativo

& lt/tr & gt;

& lttr & gt

& lttd & gtUbicación: Beijing

& lt/tr & gt;

& lttr & gt

& lttd & gtAficiones:

& lt/tr & gt;

& lttd & gtAutopresentación: el chino es una palabra

& lt/tr>

p>

& lttd & gtAutobiografía: el chino son dos bytes t

& lt/tr & gt;

& lttr & gt

& lttd colspan ="2 " >& ltInput nombre = " enviar " tipo = " enviar " valor = " confirmar envío " > & lt;inputonclick = " validador . validar(documento . getelementbyid(' demo ')" valor = " modo de inspección 1 " type = " botón " >& ltInputonclick = "validator.validator(documentation.getelementbyid('demo'), 2)" value = "modo de prueba 2" tipo = " botón ">& ltInputonclick = "validator .validate(documentation.getelementbyid ('demo'), 3)" valor = "Modo de prueba 3" tipo = "botón"></TD>

</tr>

</form>

</table>

<script>

validador = {

Solicitud: +/,

Correo electrónico:/. ^\w+([-+.]\w+)*@\w+([-.]\w+)* \.\w+([-.]\w+)*$/,

Teléfono: /^((\(\d{3}\))|(\d{3}\-)? (\(0\d{2,3}\)|0\d{2,3}-)? [1-9]\d{6,7}$/,

Teléfono móvil:/ ^((\(\d{3}\))|(\d{3}\-)? 13 { 9 } $/,

URL:/^pare(value,getattribute('operator '),getattribute('to'))",

Personalizado: "Esto. Exec(valor, getAttribute('regexp ')",

Grupo: "This. MustChecked() getAttribute('nombre '), getAttribute('min '), getAttribute('max ')",

ErrorItem: [document.forms[0]],

Mensaje de error: ["El envío falló por los siguientes motivos:\t\t\t"],

Verificación: función (formulario, modo) {

var obj = el evento srcelement;

var count = obj length;

< | p>Esto. mensaje de error .length = 1;

Esto. elemento de error .length = 1;

Esto.

Elemento de error[0]=obj;

for(var I = 0;i<count;i++){

with(obj.elements[i]){

var _ tipodatos = get atributo("tipodatos ");

if(tipo de(_tipodatos)= = " objeto " | | tipo de(este[_tipodatos])= = " indefinido ") continuar;

Esto. ClearState(obj . elementos[I]);

if(obtener atributo(" require ")== " false " & &value == " ")Continuar;

switch( _datatype){

Caso "Fecha":

Caso "Duplicado":

Caso "Rango":

Caso "Comparar" :

Caso "Personalizado":

Caso "Grupo":

Caso "Restricciones":

Caso "LimitB":

Caso "cadena segura":

if (!eval(this[_ dataType]){

this.AddError(i, getAttribute(" msg ") );

}

Romper;

Valor predeterminado:

if (!this[_datatype ].test(value)){

This.AddError(i, getAttribute("msg"));

}

Rotura;

}

}

}

if (este. mensaje de error. longitud & gt1){

modo = modo 1;

< | p>var errCount = this. Error item.length;

Cambiar (modo) {

Caso 2:

for (var I = 1; i<erCounti++)

Este. error item[I]. style. color = "red";

Caso 1:

alert(this.error message.join(" \n");

this.errorItem[1].focus();

break;

Caso 3:

para (var I = 1; I & llterCounti++){

Pruebe {

var SPAN = document . createelement(" SPAN "); " _ _ panel de mensajes de error ";

span style . color = " red ";

este. >span.innerHTML = esto. Mensaje de error[i]. reemplazar(/\d+:/, " * ");

}

catch(e){ alerta(e . descripción);}

}

Esto. Elemento de error[1]. focus();

Break;

Valor predeterminado:

Alerta(this.

mensaje de error .join(" \ n ");

Romper;

}

Devuelve falso

}

Devuelve verdadero

},

Límite: función (longitud, valor mínimo, valor máximo){

min = min 0;

máx = máximo || Número. MAX _ VALUE

Devuelve el valor mínimo& ltlen & amp& amplen & lt= max

},

LenB: función (cadena){

Return str.replace(/[^\x00-\xff]/g,"**").length;

},

ClearState: función (elem) {

Con (elem){

if(style.color == "rojo")

style.color =

var lastNode = nodo principal . nodos secundarios[nodo principal . nodos secundarios . longitud-1];

if(lastnode . id == " _ _ panel de mensajes de error ")

nodo principal. eliminar child(lastNode);

}

},

AddError: función (index, str) {

This. ErrorItem[este. ErrorItem.length] = esto. Elemento de error[0]. elemento[índice];

Esto. Mensaje de error [este. ErrorMessage.length] = esto. mensaje de error . length+":"+str;

},

Exec: function(op, reg){

Devuelve nueva RegExp(reg," g ").

prueba(op);

},

Comparar: función(op1, operador, op2) {

interruptor(operador){

Caso "No igual":

return (op1!= op2);

Caso "MayorThan":

return(op 1 & gt; op2) ;

Caso "MayorThanEqual":

return(op 1 & gt; = op2);

Caso "menos que":

return(op 1 & lt; op2);

Caso "menor o igual a":

return(op 1 & lt; = op2); p> Valor predeterminado:

return(op 1 == op2);

}

},

MustChecked: función(nombre , min , max){

var grupos = documento . getelementsbyname(nombre);

var ha comprobado = 0;

min = min |

p>

max = max | grupos.longitud

for(var I = grupos . longitud-1;i>=0;i-)

if(grupo [i].checked)ha marcado++;

Devuelve el valor mínimo& lt= hasChecked & amp& amphasChecked & lt= max

},

IsDate: función( op, formatString){

cadena de formato = cadena de formato " ymd ";

var m, año, mes, día;

cambiar (formato de cadena de caracteres){

Case "ymd":

m = op.match(new regexp("^((\\d{4})|(\ \d{2} ))([-./])(\\d{1,2})\\4(\\d{1,2})$ ");

if( m == null) Devuelve falso

día = m[6];

mes = m[5]-;

año = (m[2] 4)? m[2] : GetFullYear(parseInt(m[3], 10));

Break

Caso "dmy":

m = op. partido (nueva expresión regular ("^(\\d{1,2})([-./])(\\d{1,2 })\ \ 2((\ \ d { 4 })|(\ \ d { 2 })$ ");

si(m == null) devuelve falso

día = m[1];

mes = m[ 3]-;

Año = (m[5]).

longitud == 4)? m[5] : GetFullYear(parseInt(m[6], 10));

Descanso

Valor predeterminado:

Descanso

}

Si (!parseInt(mes)) devuelve falso

mes=mes==12?0:mes;

var fecha =nuevo Fecha (año, mes, día);

return(type of(date)== " object " &&year == fecha . obtener año completo()&&month== fecha .getmonth() &&day == fecha .getdate());

función obtener año completo(y){ return((y <30 ?" 20 ":" 19 ") +y)|

}

}

& lt/script & gt;

上篇: Cuando aprendas a programar mastercam, ¡recuerda intentar aprenderlo todo! 下篇: Falta el logotipo del calendario del teléfono móvil Oppo

Artículos populares