Ejecutar función según boton pulsado

Adler · #1 (**permalink**) 08/09/2008, 04:29

Hola

Un pequeño ejemplo de lo que quiero realizar

Código PHP:

  <html>
<head>
</head>
<body>
<div id="botonera">
<input type="button" id="Boton1" name="Boton1" value="Enviar" />
<input type="button" id="Boton2" name="Boton2" value="Enviar" />
<input type="button" id="Boton3" name="Boton3" value="Enviar" />
</div>

<script type="text/javascript">
function evento(elemento,nomevento,funcion)
{
  if (elemento.attachEvent)
  {
    elemento.attachEvent('on'+nomevento,funcion);
    return true;
  }
  else  
    if (elemento.addEventListener)
    {
      elemento.addEventListener(nomevento,funcion,false);
      return true;
    }
    else
      return false;
}
var bot = document.getElementById("botonera").getElementsByTagName("input");
for (var i=0; i<bot.length; i++) {

      evento(bot[i], "click", function(){

    if (this.id = "Boton1") {
    Cambiar1()
    }

    if (this.id = "Boton2") {
    Cambiar2()
    }

    if (this.id = "Boton3") {
    Cambiar3()
    }

      });
}

function Cambiar1() 
{
document.getElementById("Boton1").value = "A";
}

function Cambiar2() 
{
document.getElementById("Boton2").value = "B";
}

function Cambiar3() 
{
document.getElementById("Boton3").value = "C";
}

</script>
</body>
</html>

Tal y como está se ejecutan las 3 funciones (Cambiar1, Cambiar2 y Cambiar3) al cumplirse las condiciones, si lo cambio a

Código PHP:

      if (this.id = "Boton1") {
    Cambiar1()
    }
else 
    if (this.id = "Boton2") {
    Cambiar2()
    }
else
    if (this.id = "Boton3") {
    Cambiar3()
    }
else
{
return false;
}

Pulse el botón que pulse, siempre se quedará en la primera condicional. Así que, ¿como ejecuto la función correspondiente al botón que he pulsado?

Gracias

Panino5001 · #2 (**permalink**) 08/09/2008, 08:00

Tenés un par de cosas mal. Una, el operador = sirve para asignar, si lo que querés hacer es comparar, dentro del if tenés que usar ==. La otra, explorer, tal como estás asignando el evento, no entiende a this como el objeto que produce el llamado a la función. Fijate de esta otra manera:

Código PHP:

  <html>
<head>
</head>
<body>
<div id="botonera">
<input type="button" id="Boton1" name="Boton1" value="Enviar" />
<input type="button" id="Boton2" name="Boton2" value="Enviar" />
<input type="button" id="Boton3" name="Boton3" value="Enviar" />
</div>
<script type="text/javascript">
function evento(elemento,nomevento,funcion)
{
  if (elemento.attachEvent)
  {
      var f=function(){
        funcion.call(elemento,window.event);
    }
    elemento.attachEvent('on'+nomevento,f);
    return true;
  }
  else  
    if (elemento.addEventListener)
    {
      elemento.addEventListener(nomevento,funcion,false);
      return true;
    }
    else
      return false;
}
var bot = document.getElementById("botonera").getElementsByTagName("input");
for (var i=0; i<bot.length; i++) {

      evento(bot[i], "click", function(){

    if (this.id == "Boton1") {
    Cambiar1()
    }

    if (this.id == "Boton2") {
    Cambiar2()
    }

    if (this.id == "Boton3") {
    Cambiar3()
    }

      });
}

function Cambiar1() 
{
document.getElementById("Boton1").value = "A";
}

function Cambiar2() 
{
document.getElementById("Boton2").value = "B";
}

function Cambiar3() 
{
document.getElementById("Boton3").value = "C";
}

</script>

</body>
</html>

Adler · #3 (**permalink**) 08/09/2008, 11:43

Hola, agradecido Panino5001

EDITO: Por un lado no lo había probado en IE, así que gracias por evitarme tener que hacer otra consulta. Por otro lado, si sacas algo de tiempo, te agradecería si me pudieras explicar un poco esto

Código:

var f=function(){
        funcion.call(elemento,window.event);

Gracias

Panino5001 · #4 (**permalink**) 08/09/2008, 12:19

Mejor te paso un enlace: http://www.librosweb.es/ajax/capitul...s_apply_y_call

buzu · #5 (**permalink**) 08/09/2008, 13:12

Me parece raro que te haya funcionado con el primer código ya que esta poniendo if(this.id='Boton1'
cuando en realidad tendría que ser if(this.id == 'Boton1') Fíjate que lleva doble signo igual ya que esa es la comparación. Un signo igual es asignación, dos es comparación y tres es comparación estricta, lo que significa que no solo te compara que los valores sean iguales sino que tambien sean del mismo tipo.

Adler · #6 (**permalink**) 08/09/2008, 14:50

Hola

gracias Panino5001

Cita:

Iniciado por buzu

Me parece raro que te haya funcionado con el primer código ya que esta poniendo if(this.id='Boton1'
cuando en realidad tendría que ser if(this.id == 'Boton1') Fíjate que lleva doble signo igual ya que esa es la comparación. Un signo igual es asignación, dos es comparación y tres es comparación estricta, lo que significa que no solo te compara que los valores sean iguales sino que tambien sean del mismo tipo.

buzu tienes razón, al escribir el post modifiqué el original que era este

Código:

if (document.getElementById(this.id).name  = "Boton1") {
    Cambiar1()
    }

    if (document.getElementById(this.id).name  = "Boton2") {
    Cambiar2()
    }

    if (document.getElementById(this.id).name  = "Boton3") {
    Cambiar3()
    }

Como ves no me daba cuenta que no necesitaba una asignación de valor sino una comparación, de ahí mi consulta. Este si realiza lo que comentaba en post anteriores.

buzu · #7 (**permalink**) 08/09/2008, 18:38

pues yo lo veo igual, con el signo de asignación y no de comparación.... me imagino que te equivocaste otra vez... saludos.

Adler · #8 (**permalink**) 09/09/2008, 04:49

Hola

No es por insistir en algo tan nimio como esto, pero ....

Cita:

Iniciado por buzu

Como ves no me daba cuenta que no necesitaba una asignación de valor sino una comparación, de ahí mi consulta. Este si realiza lo que comentaba en post anteriores.