al hacer click sobre una imagen añadir un año diferente

zaida · #1 (**permalink**) 22/01/2007, 07:40

Hola chic@s, necsito vuestra ayuda. Espero saber explicarme.
Tengo una imagen que cuando haces click aparece otra imagen y cuando haces click sobre esta imagen que aparece aparece un año en una celda que tengo al lado de la imagen, lo que necesito es qe cada vez que haga click en la segunda imagen se vayan insertando años en la celda. como puedo hacerlo??
Espero que lo entendais y muchas gracias

Celcius · #2 (**permalink**) 22/01/2007, 10:44

Hola, bueno en realidad estoy aprendiendo Javascript, pero creo entender tu problema y te agradezco haberlo planteado. Esto es lo que yo pude hacer, por favor dame tus comentarios para saber si era lo que realmente necesitabas:

Código PHP:

  <!doctype html public "-//W3C//DTD HTML 4.01//EN">
<html>
   <head>
      <title>Cambiando banderitas y actualizando un txt</title>
      <meta http-equiv="generator" content="PHP Designer 2005" />
<script language="javascript">
var banderitas = new Array(2);
banderitas[0]=new Image();
banderitas[0].src="flag1.jpg";
banderitas[1]=new Image();
banderitas[1].src="flag2.jpg";

var el_flag=0;
function cambia(){
  if(el_flag==0){
    window.document.images[0].src = banderitas[1].src;
    var anyo = parseInt(document.miform.imagen_anyo.value);
    anyo++;
    el_flag=1;
    document.miform.imagen_anyo.value = anyo;
  }else{
    window.document.images[0].src = banderitas[0].src;
    el_flag=0;
  }
  
  
}

</script>
</head>

<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
<form name="miform">
<img src="flag1.jpg" name="elflag_1" onClick="cambia();">
<input type="text" name="imagen_anyo" value="2007">
</form>
</body>
</html>

Aqui tienes las banderitas chiquitas para que implementes todo el codigo:

zaida · #3 (**permalink**) 24/01/2007, 02:33

hola celcius

Lo primero muchas gracias por tu ayuda.Lo segundo, el código me sirvió mas o menos, lo que quiero es exactamente lo que tu has hecho pero que un año no reemplace a otro si no que se vayan agregando uno debajo del otro. Estoy trabajando en ese código, cuando lo termine lo pondré por si te puede servir ok?

saludos,mil gracias, ah!!! y siento el contestar tan tarde!!!

Celcius · #4 (**permalink**) 24/01/2007, 09:23

Hola zaida, creo que con un textbox no se podria hacer lo que pides, pero con un textarea si. Eso hice y con unas cuantas jugaditas de condicionales puedes hacerlo. Creo que mi codigo puede reducirse algo, pero aqui te lo pego para que le eches un ojo. Espero te sirva y créeme que a mi tambien me sirvio, muchas gracias

Código PHP:

  <!doctype html public "-//W3C//DTD HTML 4.01//EN">
<html>
   <head>
      <title>Cambiando banderitas y actualizando un txt</title>
      <meta http-equiv="generator" content="PHP Designer 2005" />
<script language="javascript">
var banderitas = new Array(2);
banderitas[0]=new Image();
banderitas[0].src="flag1.jpg";
banderitas[1]=new Image();
banderitas[1].src="flag2.jpg";
var el_flag=0;
var contador=1;
function cambia(){
  if(contador==1){
    anyo = parseInt(document.miform.imagen_anyo.value);
    anyo++;
    el_flag=1;
    document.miform.imagen_anyo.value+= "\n"+anyo;
    contador=0;
  }else{
        if(el_flag==0){
        window.document.images[0].src = banderitas[1].src;
        el_flag=1;
        anyo++;
        document.miform.imagen_anyo.value+= "\n"+anyo;
          }
          
        else{
        window.document.images[0].src = banderitas[0].src;
        el_flag=0;
        }
  }
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
<form name="miform">
<img src="flag1.jpg" name="elflag_1" onClick="cambia();">
<textarea name="imagen_anyo" rows="25">2007</textarea>
</form>
</body>
</html>

Celcius · #5 (**permalink**) 24/01/2007, 09:45

Hola de nuevo, me di cuenta de un "muy pequeño" errorcito :P.. olvide poner esta linea:

Código PHP:

  window.document.images[0].src = banderitas[1].src;

Dentro del condicional

Código:

if(contador==1)

La ausencia de esa linea provocaba que no se muestren las banderitas adecuadamente.

Nada mas, saludos.

zaida · #6 (**permalink**) 25/01/2007, 07:15

Hola de nuevo, tu código me funcionó, pero investigué para hacerlo un poco más sencillo, espero que te sirva de algo como a mi me sirvió el tuyo

<html>
<head>
<title>Inicio</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">

ano= 2007;
function fechas_exceptuadas()
{
dia="12";
mes="01";
if(ano==2007)
{
fecha= dia+"-"+mes+"-"+ano;
opciones=document.getElementById('select').options ;
opciones[opciones.length]=new Option(fecha);
ano++;
}
else
{
fecha= dia+"-"+mes+"-"+ano;
opciones=document.getElementById('select').options ;
opciones[opciones.length]=new Option(fecha); ano++;
}
}
</script>

</head>
<body>
<img src="imagen.gif" onclick="fechas_exceptuadas()";>
<select name="select"></select>
</body>
</html>

Todo esto puede simplificarse mas y quedaría si:

ano= 2007;
function fechas_exceptuadas()
{
ano++;
dia="12";
mes="01";
fecha= dia+"-"+mes+"-"+ano;
opciones=document.getElementById('select').options ;
opciones[opciones.length]=new Option(fecha);
}
</script>

</head>
<body>
<img src="imagen.gif" onclick="fechas_exceptuadas()";>
<select name="select"></select>
</body>
</html>

Espero que me digas lo que te parece el script
Un saludo y mil gracias por ayudarme, si puedo ayudarte en algo aqui estaré

GRACIAS!!!!!!!!!!!!