[SOLUCIONADO] No funciona reactivacion de funciones

[pvsge]

Hola a todos nuevamente. Tengo la siguiente funcion:

Código Javascript:

function habil_des(){//funcion de activar o desactivar palabras de ayudaejeeje
 
    if (document.getElementById("inp").checked == true){
        visible()
        document.getElementById("visib").onmouseup = "none"
        document.getElementById("visib").onmousedown = "none"
    }
    if (document.getElementById("inp").checked == false){
        invisible()
        document.getElementById("visib").onmouseup = "invisible()"
        document.getElementById("visib").onmousedown = "visible()"
    }
 
}
 

La uso para, al activar un input de tipo checkbox, desactive otro de tipo Button. Al activar el checkbox, desactiva perfectamente el button, pero al desactivar checkbox no vuelve al button a su estado original ¿Alguien podria ayudarme en este problema? Gracias

[Alexis88]

Estás asignando los valores de la manera incorrecta. No puedes asignar el valor none ―que se usa en CSS― a un evento, además, en el segundo bloque, asignas una cadena, no una función en sí. Eso quizá estaría bien en la definición que hagas en el marcado (HTML), pero no en el código JavaScript.

Quedaría más ordenado y sin tantas incoherencias si lo dejaras así:

Código Javascript:

function habil_des(){
    if (document.getElementById("inp").checked == true){
        visible();
    }
    else{
        invisible();
    } 
}
 

Y en cada una de esas funciones es que harías el cambio de estado del elemento, aunque si lo que tienes que hacer es simple, entonces ni siquiera es necesario el uso de otras funciones, pues podrías hacerlo dentro de las condiciones.

Saludos

[pvsge]

Iniciado por Alexis88

Estás asignando los valores de la manera incorrecta. No puedes asignar el valor none ―que se usa en CSS― a un evento, además, en el segundo bloque, asignas una cadena, no una función en sí. Eso quizá estaría bien en la definición que hagas en el marcado (HTML), pero no en el código JavaScript.

Quedaría más ordenado y sin tantas incoherencias si lo dejaras así:

Código Javascript:

function habil_des(){
    if (document.getElementById("inp").checked == true){
        visible();
    }
    else{
        invisible();
    } 
}
 

Y en cada una de esas funciones es que harías el cambio de estado del elemento, aunque si lo que tienes que hacer es simple, entonces ni siquiera es necesario el uso de otras funciones, pues podrías hacerlo dentro de las condiciones.

Saludos

Muchas gracias por tu respuesta, pero aun no me queda claro como reactivar los inputs de "onmousedown" y "onmouseup"

Gracias

[Alexis88]

Con activar, ¿te refieres a que sea visible o a modificar el valor del atributo disabled?

Muéstranos el código de tus funciones.

[pvsge]

Iniciado por Alexis88

Con activar, ¿te refieres a que sea visible o a modificar el valor del atributo disabled?

Muéstranos el código de tus funciones.

Este es el codigo de java script que actua sobre los input:

Código Javascript:

function habil_des(){//funcion de activar o desactivar palabras de ayudaejeeje
 
    if (document.getElementById("inp").checked == true){
        visible()
        document.getElementById("visib").onmouseup = ("disabled")
        document.getElementById("visib").onmousedown = ("disabled")
    }
    else{
        invisible()
        document.getElementById("visib").innerHTML.onmousedown = ("invisible()")
        document.getElementById("visib").innerHTML.onmouseup = ("visible()")
        
    }
 
}
 

Estos son los inputs:

Código HTML:

<input type="button" onmousedown= "visible()" onmouseup = "invisible()" value = "palabras disponibles" class = "visib" Id = "visib">Activar ayuda fija
    <input type = "checkbox" checked class = "perman" value = "false" id = "inp" onclick = "habil_des()">
 

[Alexis88]

Me refería a tus funciones 'visible' e 'invisible'.

[pvsge]

Iniciado por Alexis88

Me refería a tus funciones 'visible' e 'invisible'.

ah, claro, perdona...

Código Javascript:

function visible(){//hace visible las palabras de ayuda
    document.getElementById("txt").style.visibility = 'visible'
}
//------------------------------------------------------------------------------------------------
function invisible(){//devuelve invisible las palabras de ayuda
    document.getElementById("txt").style.visibility = 'hidden'
}
 

[Alexis88]

Si lo que buscas es mostrar/ocultar al elemento document.getElementById("txt") al posar/quitar el cursor del mouse del elemento document.getElementById("visib"), solo tienes que hacer esto:

Código Javascript:

var visib = document.getElementById("visib"),
    txt = document.getElementById("txt");
 
visib.addEventListener("mouseover", function(){
    txt.style.visibility = "visible";
}, false);
 
visib.addEventListener("mouseleave", function(){
    txt.style.visibility = "hidden";
}, false);
 

DEMO

Aunque esto también puedes hacerlo con CSS:

Código CSS:

#txt{
    visibility: hidden;
}
 
#visib:hover ~ #txt{
    visibility: visible;
}
 

DEMO

Particularmente, me decantaría por la segunda opción ya que, además de ahorrar algunas líneas de código, funcionará incluso si el usuario desactiva JavaScript de su navegador.

Saludos

[pvsge]

Creo que no me he expresado bien, tengo dos inputs y un texto que por defecto lo tengo como invisible.

El primer input, el button, hace visible el texto cuando lo pulso, y al soltar el click vuelve al estado invisible el texto. El segundo input, el checkbox, mantiene visible el texto al activarlo, e invisible al desactivarlo. Ademas, el checkbox, he logrado desactivar el input button cuando esta activado, pero al desactivar el checkbox, el input button sigue desactivado y no logro hacer nada para conseguir activarlo. Ese es el problema de todo.

[Alexis88]

Te mostré cómo hacer visibles/invisibles a los elementos en base a dos eventos, solo te queda utilizar otros eventos y habrás solucionado el problema, aunque, como te dije, para estas cosas, puedes optar por CSS.

Saludos

[pvsge]

Lo que busco no es ocultar o hacer visible un elemento, ya que esto lo consegui previantente con la funcion:

Funciones para cambiar estilo de CSS.

Código Javascript:

function visible(){//hace visible las palabras de ayuda
    document.getElementById("txt").style.visibility = 'visible'
}
function invisible(){//devuelve invisible las palabras de ayuda
    document.getElementById("txt").style.visibility = 'hidden'
}
 

El problema es este input:

Código HTML:

<input type = "checkbox" checked class = "perman" value = "false" id = "inp" onclick = "habil_des()">
 

que al activarlo desactiva este input:

Código HTML:

<input type="button" onmousedown= "visible()" onmouseup = "invisible()" value = "palabras disponibles" class = "visib" Id = "visib">
 

Pero, al desactivar el primer input, no vuelve a activar el segundo. No es una cuestion de que se visualice o no un texto, es que el button deja de funcionar, al desactivar el checkbox.

He probado con esta funcion, pero no me ha dado el resultado que buscaba:

Código Javascript:

function habil_des(){//funcion de activar o desactivar palabras de ayudaejer
 
    if (document.getElementById("inp").checked == true){
        visible()
        document.getElementById("visib").onmouseup = ("disabled")
        document.getElementById("visib").onmousedown = ("disabled")
    }
    else{
        invisible()
        document.getElementById("visib").innerHTML.onmousedown = ("invisible()")
        document.getElementById("visib").innerHTML.onmouseup = ("visible()")
        
    }
 
}
 

Esta función logra hacer que al activar el checkbox, el texto se vuelva visible, que es lo que busco, y tambien que al desactivar el checkbox, el texto se vuelva invisible. Esto perfecto. Pero ademas, con estas lineas he intentado desabilitar el button al activar el checkbox:

Código Javascript:

if (document.getElementById("inp").checked == true){
        visible()
        document.getElementById("visib").onmouseup = ("disabled")
        document.getElementById("visib").onmousedown = ("disabled")
    }
 

y he intentado hacer el proceso inverso. Reactivar el button al desactivar el checkbox:

Código Javascript:

else{
        invisible()
        document.getElementById("visib").innerHTML.onmousedown = ("invisible()")
        document.getElementById("visib").innerHTML.onmouseup = ("visible()")
        
    }
 

es esta ultima parte donde no logro avanzar. No reactiva el button al desactivar el checkbox. No se si me he expresado bien esta vez.

Saludos y gracias por vuestra paciencia.

[Adrianbu95]

Vale, suponemos que ya tienes lista y solucionada la primera parte que consiste en hacer visible o invisible el texto.
La segunda parte, desactivar el boton:
Para ello si quieres que se deshabiliten al activar el input tienes que hacerlo con la propiedad disabled, no onmouse.

Código Javascript:

document.getElementById("visib").disabled= "true";
 

Y si es el caso de que quieres hacerlo al pasar el raton por encima crea una nueva función del mismo tipo.
Un saludo

[Alexis88]

Esto:

Iniciado por pvsge

Código Javascript:

function habil_des(){//funcion de activar o desactivar palabras de ayudaejer
 
    if (document.getElementById("inp").checked == true){
        visible()
        document.getElementById("visib").onmouseup = ("disabled")
        document.getElementById("visib").onmousedown = ("disabled")
    }
    else{
        invisible()
        document.getElementById("visib").innerHTML.onmousedown = ("invisible()")
        document.getElementById("visib").innerHTML.onmouseup = ("visible()")
        
    }
 
}
 

No tiene sentido. Para habilitar/deshabilitar un elemento del DOM, tienes que asignar o bien el valor true o false al atributo disabled del mismo, tal y como lo mencioné en una de mis respuestas anteriores.

Por otro lado, la propiedad innerHTML se utiliza para tomar/asignar el contenido de un elemento, por lo que intentar aplicar un evento al contenido, es imposible. Los eventos se aplican sobre los elementos, mas no sobre su contenido u otra propiedad.

Para el tema de la habilitación/deshabilitación del botón al estar marcado/desmarcado el checkbox, tendrías que hacer esto:

Código Javascript:

function habil_des(){
    var visib = document.getElementById("visib"),
        inp = document.getElementById("inp");
    visib.disabled = inp.checked ? true : false;
}
 

Y, por lógica, al estar deshabilitado, los clics no deberían de surtir efecto en el botón. Solo tendrán efecto cuando el botón esté habilitado.

Saludos

[pvsge]

Iniciado por Alexis88

Esto:



No tiene sentido. Para habilitar/deshabilitar un elemento del DOM, tienes que asignar o bien el valor true o false al atributo disabled del mismo, tal y como lo mencioné en una de mis respuestas anteriores.

Por otro lado, la propiedad innerHTML se utiliza para tomar/asignar el contenido de un elemento, por lo que intentar aplicar un evento al contenido, es imposible. Los eventos se aplican sobre los elementos, mas no sobre su contenido u otra propiedad.

Para el tema de la habilitación/deshabilitación del botón al estar marcado/desmarcado el checkbox, tendrías que hacer esto:

Código Javascript:

function habil_des(){
    var visib = document.getElementById("visib"),
        inp = document.getElementById("inp");
    visib.disabled = inp.checked ? true : false;
}
 

Y, por lógica, al estar deshabilitado, los clics no deberían de surtir efecto en el botón. Solo tendrán efecto cuando el botón esté habilitado.

Saludos

Muchas gracias. Aun tengo mucho que aprender. Hay conceptos que no manejo del todo bien. Gracias y espero que esto me ayude.