Foro de elhacker.net

Programación => Ejercicios => Mensaje iniciado por: Arm144 en 26 Febrero 2017, 21:41 pm



Título: javascript método onClick();
Publicado por: Arm144 en 26 Febrero 2017, 21:41 pm
Buenas me gustaría saber una forma de conseguir que al pulsar un botón me devuelva por ejemplo 'a'. a continuación si pulso de nuevo que me devuelva 'b'. y repetir el proceso.
Todo ello en javascript lo he intentado de mil y una formas y ya me quedo sin ideas.
Pense esto pero obviamente no funciona.

Código:
<script>
function valor(values){
value=values.split(",");
for(var i=0;i<value.length;i++){
if (value=='A'){
var value='B';
}else if(value=='B'){
var value='A';
}
alert(value);
i++;
}
}
</script>
<body>
<input type="button" onClick="valor('ASC,DESC');" value="valor">
</body>


Título: Re: javascript metro onClick();
Publicado por: engel lex en 26 Febrero 2017, 21:48 pm
tienes varias formas, una sería hacer una variable global para darle el valor, otra es pegarlo a la variable window para hacerla global dinamicamente, otra forma es pasarselo a algún campo asociado al boton para que el sea quien lo guarde


Título: Re: javascript método onClick();
Publicado por: Arm144 en 26 Febrero 2017, 22:33 pm
Algún ejemplo por favor?, ya que lo intenté con variable global y tampoco me salió anteriormente.  :-[


Título: Re: javascript método onClick();
Publicado por: engel lex en 26 Febrero 2017, 22:44 pm
para mi esmas facil que el botón guarde el estado, así que lo haré así

fijate que paso un argumento "this" que referencia al mismo botón y que agrego una propiedad que no interferiá con el funcionamiento del input
Código
  1. <input type="button" onClick="valor(this);" value="valor" estado="A">


con manejo del DOM es cosa de acceder al estado para leerlo y cambiarlo, usando como ancla el argumento pasado

Código
  1. function valor(elemento) {
  2.    var att = elemento.getAttribute("estado");
  3.    alert(att)
  4.    if(att=='A'){
  5.     elemento.setAttribute("estado","B");
  6.    }else{
  7.     elemento.setAttribute("estado","A");
  8.    }
  9.  


Título: Re: javascript método onClick();
Publicado por: Arm144 en 26 Febrero 2017, 23:31 pm
Gracias resuelto del siguiente modo:
Código:
<script>
window.estado=0;
function verificador(estado)
{
if (estado==0)
{
alert("DESC");
window.estado++;
}
else if (estado==1)
{
alert("ASC");
window.estado=0;
}

}
</script>
<body>
<button onclick="verificador(estado);">PRUEBA</button>
</body>


Título: Re: javascript método onClick();
Publicado por: engel lex en 26 Febrero 2017, 23:36 pm
el window.estado hace el trabajo, te doy 2 correciones

no estás usando estado, no lo necesitas como parametro, puedes quitarlo en
Código:
function verificador()


y

Código:
onclick="verificador();"

otra cosa, si vas a manejar solo 0 y 1 no uses ++, podría causarte un conflicto si tu codigo se vuelve más complejo, usa solo estado bien conocidos, tambien, si no vas a usar más casos de if, no es necesario el else if, un simple else hará el trabajo y ayudará a reducir errores, para esto

Código:
if (estado==0)
    {
     alert("DESC");
     window.estado=1;
    }
    else
    {
     alert("ASC");
     window.estado=0;
    }


Título: Re: javascript método onClick();
Publicado por: WHK en 27 Febrero 2017, 00:11 am
Para crear atributos personalizados en html se utiliza data-nombre, reemplazas nombre por el nombre del parametro personalizado, sin espacios ni guiones adicionales, solo letras y números.

Por ejemplo:

Código:
<input type="button" onclick="valor(this);" value="valor" data-estado="A">

Otra cosa, onClick no existe como atributo según el estandar de la w3c, que los navegadores lo ejecuten es otra cosa pero no están obligados a hacerlo, el estandar a partir de xhtml hacia arriba dice que todos los nombres de etiquetas y atributos van en minusculas, las mayusculas no debieran ser interpretados.



Título: Re: javascript método onClick();
Publicado por: engel lex en 27 Febrero 2017, 00:18 am
Para crear atributos personalizados en html se utiliza data-nombre, reemplazas nombre por el nombre del parametro personalizado, sin espacios ni guiones adicionales, solo letras y números.

Por ejemplo:

Código:
<input type="button" onclick="valor(this);" value="valor" data-estado="A">

Otra cosa, onClick no existe como atributo según el estandar de la w3c, que los navegadores lo ejecuten es otra cosa pero no están obligados a hacerlo, el estandar a partir de xhtml hacia arriba dice que todos los nombres de etiquetas y atributos van en minusculas, las mayusculas no debieran ser interpretados.



:silbar: tengo ue retomar un poco el studio de los standards! jejeje gracias por la aclaración


Título: Re: javascript método onClick();
Publicado por: Arm144 en 27 Febrero 2017, 01:36 am
Gracias por las correciones y ayudas. Saludos