validacion - validar formulario javascript onclick

Problema de validación de JavaScript con caracteres internacionales

Question

Utilizamos el excelente complemento de validación para jQuery aquí en Stack Overflow para hacer la validación del lado del cliente de la entrada antes de enviarla al servidor.

En general, funciona bien, sin embargo, este nos hace rascar la cabeza.

El siguiente método de validación se utiliza en el formulario de solicitud / respuesta para el campo de nombre de usuario (tenga en cuenta que debe cerrar la sesión para ver este campo en el sitio en vivo, está en cada página /question y en la página /ask )

$.validator.addMethod("validUserName",
  function(value, element) {
  return this.optional(element) || 
  /^[/w/-/s/dÀÈÌÒÙàèìòùÁÉÍÓÚÝáéíóúýÂÊÎÔÛâêîôûÃÑÕãñõÄËÏÖÜäëïöüçÇßØøÅåÆæÞþÐð]+$/.test(value); },
  "Can only contain A-Z, 0-9, spaces, and hyphens.");  

Ahora esta expresión regular se ve raro, pero es bastante simple:

• unir el comienzo de la cadena (^)
• coincide con cualquiera de estos ...
  • carácter de palabra (/ w)
  • dash (-)
  • espacio (s)
  • dígito (/ d)
  • personajes del lenguaje loco de la luna (àèìòù etc)
• ahora coincide con el final de la cadena ($)

Sí, nos topamos con el problema de Expresiones regulares internacionalizadas . La definición de JavaScript de "carácter de palabra" no incluye caracteres internacionales ... en absoluto.

Aquí está la parte extraña: a pesar de que nos hemos tomado la molestia de agregar manualmente toneladas de los caracteres internacionales válidos a la expresión regular, no funciona . No puede ingresar estos caracteres internacionales en el cuadro de entrada para el nombre de usuario sin obtener el ..

Solo puede contener AZ, 0-9, espacios y guiones

.. validación de devolución!

Obviamente, la validación está funcionando para las otras partes de la expresión regular ... entonces ... ¿qué da?

La otra parte extraña es que esta validación funciona en la consola de JavaScript del navegador, pero no cuando se ejecuta como parte de nuestro estándar * .js incluye.

/ ^ [/ w- / sÀÈÌÒÙàèìòùÁÉÍÓÚÝáéíóúýÂÊÎÔÛâêîôûÃÑÕãâñåÄËÏÖÜäëïöüçÇßØøÅåÆæÞþÐð] + $ / .test (''ÓBill de hÓra'') === true

Nos encontramos con algunos problemas de carácter internacional muy extraños en el código de JavaScript antes, lo que resulta en algunos muy, muy desagradables hacks. Nos gustaría entender qué está pasando aquí y por qué. Por favor, ilumínanos!

Answer 1

¿Cuál es la codificación de caracteres del archivo JS?

Para XML QNames utilizo este RegExp:

/**
 * Definition of an XML Name
 */
var NameStartChar = "A-Za-z:_/u00C0-/u00D6/u00D8-/u00F6/u00F8-/u02FF/u0370-/u037D"+
                    "/u037F-/u1FFF/u200C-/u200D/u2070-/u218F/u2C00-/u2FEF/u3001-/uD7FF"+
                    "/uF900-/uFDCF/uFDF0-/uFFFD/u010000-/u0EFFFF";
var NameChar = NameStartChar+"//-//.0-9/u00B7/u0300-/u036F/u203F-/u2040";
var Name = "^["+NameStartChar+"]["+NameChar+"]*$";
RegExp (Name).test (value);

Funciona como un encanto también con personajes internacionalizados. Tenga en cuenta el escape. Debido a eso, puedo restringir el archivo JS a caracteres ASCII solamente. Por lo tanto, no me meto en problemas cuando trato con conjuntos de caracteres ISO-8859 vs UTF-8.

Esto no es más cierto si usa codificaciones de caracteres donde ASCII no es un subconjunto real (como, por ejemplo, en Asia UTF-16).

Aclamaciones,

Answer 2

Creo que los métodos de validación de correo electrónico y URL son una buena referencia aquí, por ejemplo. el método de correo electrónico:

email: function(value, element) {
    return this.optional(element) || /^((([a-z]|/d|[!#/$%&''/*/+/-//=/?/^_`{/|}~]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])+(/.([a-z]|/d|[!#/$%&''/*/+/-//=/?/^_`{/|}~]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])+)*)|((/x22)((((/x20|/x09)*(/x0d/x0a))?(/x20|/x09)+)?(([/x01-/x08/x0b/x0c/x0e-/x1f/x7f]|/x21|[/x23-/x5b]|[/x5d-/x7e]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(//([/x01-/x09/x0b/x0c/x0d-/x7f]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF]))))*(((/x20|/x09)*(/x0d/x0a))?(/x20|/x09)+)?(/x22)))@((([a-z]|/d|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(([a-z]|/d|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])*([a-z]|/d|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])))/.)+(([a-z]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(([a-z]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])*([a-z]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])))/.?$/i.test(value);
},

La secuencia de comandos para compilar esa expresión regular .

En otras palabras, reemplazar su lista arbitraria de personajes de "luna loca" con esto podría ayudar:

[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF]

Básicamente, esto evita los problemas de codificación de caracteres que tiene en otros lugares al reemplazar los caracteres de codificación de necesidades con definiciones más generales. Si bien no es necesariamente más legible, hasta ahora es más corto que su lista completa.

Answer 3

Esto no es realmente una respuesta, pero aún no tengo 50 representantes para agregar un comentario ... Definitivamente se puede atribuir a problemas de codificación.

Sí, "ECMA no debería preocuparse por la codificación ..." bla, bla, bueno, si está en Firefox, vaya a Ver> Codificación de caracteres> Western (ISO-8859-1) y luego intente usar el campo Nombre.

Funciona bien para mí después de cambiar la codificación manualmente (se concede que al resto de la página no le gusta el interruptor de codificación,: P)

(en IE8 puede ir a Página> Codificación> Europeo occidental (Windows) para obtener el mismo efecto)

Answer 4

Tarde en el juego aquí, pero acabo de usar esta expresión y parecía funcionar bien para mí. Parece ser bastante completo y relativamente simple:

var re = /^[A-zÀ-ÿ/s/d-]*$/g; 
var str1 = ''casa-me,pois 99 estou farto! Eis a lista:uma;duas;três'';
var str2 = ''casa-me pois 99 estou farto Eis a lista uma duas três'';

alert(re.test(str1));
alert(re.test(str2));

Answer 5

Use algo como Fiddler o Charles (no el panel de red de Firebug, o cualquier otra cosa que esté realmente dentro del navegador) para examinar lo que realmente está pasando por el cable. Es casi seguro un problema de codificación: o el archivo se ha guardado en algún juego de caracteres de Microsoft y se está enviando como UTF-8, o tal vez al revés.

En el caso de JS RegExps, puede, como señala Boldewyn, evitar estos problemas especificando el punto de código Unicode para los caracteres que desea que están fuera del rango US-ASCII. Sin embargo, también sería bueno asegurarse de no mezclar las codificaciones entre el lugar donde se guarda el archivo y el lugar donde se sirve.

Answer 6

Viendo que la declaración funciona en la consola, ¿podría esto tener que ver la forma en que se guardan los archivos .js (es decir, ascii o UTF-8) y que el navegador los carga de esa manera y en el proceso traduce los caracteres?

Answer 7

los caracteres internacionales enumerados son parte de ASCII extendido. los que ha agregado no son ciertamente.