Foros del Web » Programando para Internet » Javascript »

[SOLUCIONADO] imagenes con ñ y/o acentos

Estas en el tema de imagenes con ñ y/o acentos en el foro de Javascript en Foros del Web. Tengo un cliente un poco particular y no hay manera de hacerle entender que no es el modo correcto, así que no me queda otra ...
  #1 (permalink)  
Antiguo 10/04/2014, 05:53
 
Fecha de Ingreso: marzo-2012
Ubicación: Madrid
Mensajes: 37
Antigüedad: 12 años, 9 meses
Puntos: 0
Pregunta imagenes con ñ y/o acentos

Tengo un cliente un poco particular y no hay manera de hacerle entender que no es el modo correcto, así que no me queda otra que adaptarme a el.

El caso es que lo que necesito es cambiar el fondo (background) de una pagina en concreto por la imagen de varias personas, tengo esas fotos en una carpeta, y el nombre de las fotos es el nombre de la persona en concreto terminado en jpg.
Como con un ejemplo es mas facil explicarse, os explico.

/img/personas/pepito-apellido-con-ñ.jpg
/img/personas/juanito-mi-nombre-solo-tiene-acentos-á-é-í.jpg

esas serian las rutas de las imagenes que dan problemas en cuestion

el codigo con el que lo estoy intentando es

Código:
nombre = replaceAll(nombre," ","-");
url = ('../img/personas/'+nombre+'.jpg');
$("body").css("background-image", 'url("'+url+'")');
No doy con la clave para poder enlazar a esas imagenes y cambiarlas por JS o JQuery

Alguna idea amigos??
Un abrazo y gracias de antemano
  #2 (permalink)  
Antiguo 10/04/2014, 06:49
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Sabadell
Mensajes: 4.897
Antigüedad: 16 años, 9 meses
Puntos: 574
Respuesta: imagenes con ñ y/o acentos

1.- La ruta es la que es? Tienes ese codigo en un directorio js.... y el html o lo que sea que lo usa en otro directorio, ojo con la ruta relativa.

2.- Ese replace all da el resultado esperado?

No podrías convencer al cliente de usar el identificador de la persona como nombre del fichero (el DNI p.e.), no le digas que debe hacer faltas de ortografia, y de paso le vendes un gestor de ficheros que le traduzca identificador por nombre....???
__________________
Quim
--------------------------------------------------
Ayudar a ayudar es una buena práctica!!! Y da buenos resultados.

Última edición por quimfv; 10/04/2014 a las 07:00
  #3 (permalink)  
Antiguo 10/04/2014, 07:02
Avatar de Artificium  
Fecha de Ingreso: enero-2011
Mensajes: 492
Antigüedad: 13 años, 11 meses
Puntos: 81
Respuesta: imagenes con ñ y/o acentos

Bueno, algunos clientes son así, en todo caso lo que yo haría sería "limpiar" esos nombres de carpetas o nombres de archivos. Busca una función que te cree "slug" y utiliza eso en lugar del nombre original. Esa sería mi recomendación.
  #4 (permalink)  
Antiguo 10/04/2014, 07:06
 
Fecha de Ingreso: marzo-2012
Ubicación: Madrid
Mensajes: 37
Antigüedad: 12 años, 9 meses
Puntos: 0
Respuesta: imagenes con ñ y/o acentos

Soy un gran cap......
Tema Solucionado estaba usando la ruta copiada desde la imagen por defecto que se la doy desde los css, y como tanto los css como los js estan guardados en un carpeta al mismo nivel que las imagenes, deje los ../ olvidando que al llamar al js desde el fichero php estoy en un nivel mas bajo...
En fin que mi problema era que no apuntaba a la carpeta correcta, aunque por otro lado la consola me arrojaba un error con el nombre codificado, y si mandaba imprimir por consola la ruta que le daba yo lo veia correctamente, asi que me pense que era problema de codificacion.

No hay nada como comer y tomarse un cafecito para resolver los problemas, por cierto os dejo este otro codigo que es con el que me dado cuenta del error por si a alguien le es de utilidad

Código:
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.cssClass { background-image: url("img/personas/'+nombre+'.jpg"); }';
document.getElementsByTagName('head')[0].appendChild(style);

document.body.className = 'cssClass';
Gracias a todos
  #5 (permalink)  
Antiguo 10/04/2014, 07:07
 
Fecha de Ingreso: marzo-2012
Ubicación: Madrid
Mensajes: 37
Antigüedad: 12 años, 9 meses
Puntos: 0
Respuesta: imagenes con ñ y/o acentos

Gracias, si
da el resultado esperado la funcion es esta por si le sirve a alguien

function replaceAll( text, busca, reemplaza ){
while (text.toString().indexOf(busca) != -1)
text = text.toString().replace(busca,reemplaza);
return text;
}
  #6 (permalink)  
Antiguo 10/04/2014, 08:16
Avatar de Artificium  
Fecha de Ingreso: enero-2011
Mensajes: 492
Antigüedad: 13 años, 11 meses
Puntos: 81
Respuesta: imagenes con ñ y/o acentos

ReplaceAll? pero si en JavaScript existe un método que hace eso? para qué creas otra función que hace lo mismo? Se hace así mira:

var text = texto.replace(/buscar/g, reemplazar);

Pero se debe tomar en cuenta que "/buscar/g" es literal no variable y reemplazar sí es una variable. Nada más.
  #7 (permalink)  
Antiguo 11/04/2014, 01:03
 
Fecha de Ingreso: marzo-2012
Ubicación: Madrid
Mensajes: 37
Antigüedad: 12 años, 9 meses
Puntos: 0
Respuesta: imagenes con ñ y/o acentos

No te digo que no tengas razon, pero tampoco que estes acertado en esto XD
Es cierto que JS tiene un metodo que es replace, pero lo unico que hace es reemplazar el primer caracter que se encuentre de los que tu le indicas en mi caso como has visto reemplazo los espacios en blanco por guiones, por lo que usando el metodo replace solo me reemplaza el primer espacio quedando algo asi Nombre-Apellido1 Apellido2 y no me sirve.

El metodo que os he dejado arriba, lo llevo usando algun tiempo, no recuerdo de donde lo saque, aunque como veis es solo un bucle que pasa tantas veces como sea necesario y dentro del mismo usa el replace de JS
  #8 (permalink)  
Antiguo 11/04/2014, 02:08
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: Sabadell
Mensajes: 4.897
Antigüedad: 16 años, 9 meses
Puntos: 574
Respuesta: imagenes con ñ y/o acentos

Código HTML:
Ver original
  1. <!DOCTYPE html>
  2.  
  3. <p id="demo">Tengo esto</p>
  4.  
  5. <button onclick="cambia()">Cambia</button>
  6.  
  7. function cambia()
  8. {
  9. var str = document.getElementById("demo").innerHTML;
  10. var acambiar="Tengo esto";
  11. var esto="Ahora ya no";
  12. var res = str.replace(acambiar,esto);
  13. document.getElementById("demo").innerHTML=res;
  14. }
  15.  
  16. </body>
  17. </html>

Los dos parametros de replace pueden ser una variable.
__________________
Quim
--------------------------------------------------
Ayudar a ayudar es una buena práctica!!! Y da buenos resultados.
  #9 (permalink)  
Antiguo 11/04/2014, 11:57
Avatar de Artificium  
Fecha de Ingreso: enero-2011
Mensajes: 492
Antigüedad: 13 años, 11 meses
Puntos: 81
Respuesta: imagenes con ñ y/o acentos

Lo que no sabes es que el método replace usa como paramétro una expresión regular y no una cadea de texto común. Te daré un ejemplo para reemplazar todos los carácters que encuentre en una cadena.

Código PHP:
var cadena "cadena-con-guiones";
var 
otraCadena cadena.replace(/-/g' '); 
Debes poner tal y como lo pongo, entre los dos slash la cadena de texto a reemplazar y una "g" después que le indica que debe reemplazar todas las veces que encuentre el carácter y no solo una vez.

La función que usas tiene la desventaja de hacer mucho proceso, aunque seguro no se siente. Pero en todo caso usa lo que ya tiene el lenguaje, y de paso te sugiero que aprendas un poco de expresiones regulares que te podría servir más adelante.

Última edición por Artificium; 11/04/2014 a las 20:13

Etiquetas: acentos, imagenes, jquery, js
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:12.