[Javascript no intrusivo] Limitar número de carácteres en una Textarea

[1984]

Buenas, abro un nuevo hilo porque el otro ya estaba caducado.

En el otro hilo he leido la manera de hacerlo incrustando el script en html, que sería de la siguiente manera:

Código:

Código:

<script>
function maximo(campo,limite){
if(campo.value.length>=limite){
campo.value=campo.value.substring(0,limite);
}
}
</script>

Código en HTML:

Código:

<textarea cols="40" rows="10" onKeyUp="maximo(this,255);" onKeyDown="maximo(this,255);"></textarea>

Entonces...

Para hacerlo de manera no intrusiva en el HTML quedaría:

Código:

<textarea cols="40" rows="10" id="limite"></textarea>

Y al final de esta misma hoja:

Código:

<script type="text/javascript" src="url de la función"></script>

Mi duda es entonces: ¿como paso la función al fichero de javascript externo?

[_cronos2]

No entendí qué quieres decir, pero se hace normal y corriente

Código Javascript:

//tuarchivo.js
function maximo(){
 var texto = document.getElementById('limite');
 if(texto.value.length>=255){
  texto.value=texto.value.substring(0,255);
 }
}
 

Código HTML:

<script type='text/javascript' src='tuarchivo.js'></script>
 

La única cuestión es que si no quieres usar onkeyup y onkeydown tienes que buscar un evento en el que comprobar el largo del campo, o usar setInterval.

Saludos (:

[zerokilled]

@1984,
segun lo que describes, tal cosa no se llama "javascript no intrusivo". me parece que estas hablando de modularidad o separacion de programacion y contenido. javascript no intrusivo es totalmente diferente.

[1984]

Iniciado por zerokilled

@1984,
segun lo que describes, tal cosa no se llama "javascript no intrusivo". me parece que estas hablando de modularidad o separacion de programacion y contenido. javascript no intrusivo es totalmente diferente.

Ok, gracias por la atención. La verdad es que ando muy perdido y por lo que veo me he cruzado con info contradictoria en muchas páginas, o al menos confusa. Mediante PHP ya tengo fijado un máximo de carácteres a introducir en la textarea, pero quiero hacerlo más "agradable" para aquellos usuarios con javascript activado, de forma que uso javascript como complemento y no como condición indispensable para el correcto funcionamiento de mi web. Por lo que he leido, esta sería esta la filosofía el javascript no intrusivo ¿no?

Aparte, quería sacar los scripts de la página html, al igual que hago con los estilos en css, para dejar más limpio el código.

[1984]

Iniciado por _cronos2

No entendí qué quieres decir, pero se hace normal y corriente

Código Javascript:

//tuarchivo.js
function maximo(){
 var texto = document.getElementById('limite');
 if(texto.value.length>=255){
  texto.value=texto.value.substring(0,255);
 }
}
 

Código HTML:

<script type='text/javascript' src='tuarchivo.js'></script>
 

La única cuestión es que si no quieres usar onkeyup y onkeydown tienes que buscar un evento en el que comprobar el largo del campo, o usar setInterval.

Saludos (:

Ok. Muchas gracias cronos2. Me pondré a investigarlo. :)

Aún así, esto me está dando muchos quebraderos de cabeza ya que en la red encuentro por doquier srcripts para incrustar en html, pero sin embargo no encuentro esas mismas funciones para usarlas de la forma en la que planteo. ¿?

[bng5]

Me parece que se fueron un poco del tema.

El modo estandar es usando el método addEventListener y en IE attachEvent

[zerokilled]

Iniciado por 1984

[...]de forma que uso javascript como complemento y no como condición indispensable para el correcto funcionamiento de mi web. Por lo que he leido, esta sería esta la filosofía el javascript no intrusivo ¿no?

si pero parece que lo estas entendiendo mal. se dice que un script es intrusivo cuando no hay funcionalidad en reverso si se desactiva javascript. dos ejemplos clasicos de codigos intrusivos.

Código:

// popup de enlace;
<a href="javascript:self.open('http://url')">enlace</a>

// boton de envio;
<input type="button" onclick="if(validation) document.form.submit();" value="boton enviar" />

el mismo codigo no intrusivo...

Código:

<a href="http://url" onclick="self.open(this.href)">enlace</a>

<form onsubmit="if(!validation)return false;">
<input type="submit" value="boton enviar" /></form>

[1984]

Ok. Más claro agua, zerokilled. Gracias por aclararme este concepto. :)

Vale. Según lo que aquí me habéis comentado, ¿podría ser algo similar a esto?...

Función externa javascript:

Código:

function maximo(){
var texto = document.getElementById ('limite');
if(texto.value.length>=255){
texto.value=texto.value.substring(0,255);
}}
window.onload = function() {
var el = document.getElementById ('limite');   
el.addEventListener("KeyUp", maximo, false);   
}

... que obviamente no me funciona. Lo que me da a entender que estoy comentando alǵun que otro error bastante garrafal.

[1984]

¡Solucionado!

Pego el código por si a alguien le interesa:

Código Javascript:

Código:

function maximo() {
	//se almacena el texto que contiene el textarea al que se enlaza el evento, referenciado como "this"
	var texto = this.value;
	//si la longitud del texto ya es mayor que 255, se devuelve false cancelando el evento
	if (texto.length > 255) {
		this.value = texto.substr(0,255);
		return false;
	}
}
window.onload = function() {
	document.getElementById ('limite').addEventListener("keyup", maximo , false);
}

Código HTML:

Código:

<textarea cols="40" rows="10" id="limite"></textarea>

Código:

<script type="text/javascript" src="url de la funcion .js"></script>