0

sucede que estoy creando mis funciones js y las utilizo en mi html, pero aves funcionan y otras veces no, e incluso si borro la función sigue funcionando, o hay elementos en los cuales no quieren funcionar las funciones que creo.

function siguienteElemento4(){
    pE=document.getElementById('p5').style.display='block'; 
      
};

En esta funcion me va a ocultar un elemento cuando click sobre un radio button

function siguienteElemento5(){
    pE=document.getElementById('p5').style.display='none'; 
    if(pE==(display='none')){
        pF=document.getElementById('btnGuardar').style.display='block';
    }  
      
};

En esta ultima va a hacer el proseco inverso y ademas me va a mostrar un boton, es el fin del formulario, estonces si da si le muestra otro div con mas imputs y button submnit, peri si da no lo va a ocultar y mostar un button submit.

pero le pongo un alert a estos y no funciona, pero tengo un alert anterior y si se lo pongo funciona, entonces no se a que se deba esto.

Hace cosas que no deberia, si borro la funcion de ocultar, no deberia de hacer nada no? pero muestra el siguiente, si le pongo un alert a esa misma funcion, lo omite y sigue mostrando el siguiente div.

4
  • Tu if está mal, corrígelo y avísame si te sigue pasando el problema
    – Yussef
    el 6 nov. 2022 a las 19:37
  • ¿Qué crees que significa esta sentencia: pE==(display='none')? Aún más, ¿Qué crees que almacena pE en esta asignación: pE=document.getElementById('p5').style.display='none'; ? el 6 nov. 2022 a las 19:44
  • pE==(display='none') si ese id esta oculto me va a hcer lo siguiente, tuve que crear otra pagina js y crear ahi las mismas funciones, y ya las agarro, pero si lo hacia todo ahi mismo no funcionaba, tengo como 6 funciones asi mismo pero las anteriores si funcionan, lo que quiero hacer es cliquear siguiente y que me oculte la preguta actual y me muestre la siguiente, y asi sucesivamente. solo era copiar las que ya tenia pero no las reconocia o hacia algo distinto, la "Solución" fue crearlas en otra pagina js y luego pergarlas en el anterior para mantener el orden. no se porque sucede eso. el 6 nov. 2022 a las 19:54
  • que le falta al if? el 6 nov. 2022 a las 19:55

1 respuesta 1

2

Vamos a analizar tu código para que lo puedas entender:

  • Cuando escribes esto:
function siguienteElemento4(){
    pE=document.getElementById('p5').style.display='block'; 
};

de hecho estás realizando dos asignaciones a la vez, a saber:

  1. document.getElementById('p5').style.display='block';: Es decir, estás asignando al elemento que tiene el id denominado p5 la propiedad CSS display='block'

  2. Estás asignando a la variable pE el valor de la cadena de texto 'block'

Es decir, en dos líneas sería así:

document.getElementById('p5').style.display='block'; 
pE='block'; 

No creo que sea lo que pretendes, visto el siguiente código que expones en la pregunta, donde repites ese tipo de asignación:

function siguienteElemento5(){
    pE=document.getElementById('p5').style.display='none'; 
    if(pE==(display='none')){
        pF=document.getElementById('btnGuardar').style.display='block';
    }  
      
};

Si te fijas, haces lo mismo, solo que cambiando el valor del final de la igualdad por none.

pE=document.getElementById('p5').style.display='none'; 

y que de nuevo, lo que estás realmente asignando es esto:

document.getElementById('p5').style.display='none'; 
pE='none';

Visto esto, ya puedes empezar a deducir que tu condicional tampoco es que sea muy ortodoxo que digamos, pues escribes esto:

if(pE==(display='none')){

que se podria dividir en esto y sería lo mismo que le estás diciendo:

display='none'
if(pE=='none')){

¿Y eso porque? Pues bueno, porque si te fijas dentro del paréntesis estás realizando una asignación tal como lo tienes escrito:

(display='none') 

y el resultado de esa asignación es none, así que toma ese valor para compararlo con la variable puesta en el primer operador de la igualdad, que es pE. Y como ya hemos visto antes, ya sabemos que la habias definido asi: pE='none';, por lo tanto, ese condicional siempre va a cumplirse (por lo tanto sobra completamente).

Y para finalizar, por si aún no fuera suficiente vuelves a repetir ese tipo de asignación con esta otra variable:

pF=document.getElementById('btnGuardar').style.display='block';

que es una forma abreviada de escribir lo que realmente hace, que es:

document.getElementById('btnGuardar').style.display='block';
pF='block';

Y hasta aquí puedo leer... Estaría bien saber lo que realmente pretendes con esas funciones y ese condicional para poderte ayudar más, pero no lo has puesto en la pregunta.

Aquí te dejo unos snippets que demuestran lo que acabo de explicar, donde muestro los resultados de cada asignación usando console.log() (los alerts a veces van bien, pero rayan un poco):

Primer caso:

function siguienteElemento4() {
  pE = document.getElementById('p5').style.display = 'block';
  console.log("pE = " + pE)
  console.log("CSS display de p5 = " + document.getElementById('p5').style.display)
}
siguienteElemento4()
<p id="p5" style="display: none;">
  Texto en p5
</p>
<button id="btnGuardar">
btnGuardar
</button>

Segundo caso:

function siguienteElemento5(){
    pE=document.getElementById('p5').style.display='none'; 
    console.log("CSS display de p5 = " + document.getElementById('p5').style.display)
    console.log("pE = " + pE)
    if(pE==(display='none')){
        console.log("display = " + display)
      pF=document.getElementById('btnGuardar').style.display='block';
      console.log("pF = " + pF)
      console.log("CSS display de btnGuardar = " + document.getElementById('btnGuardar').style.display)
    }  
      
}
siguienteElemento5()
<p id="p5">
Texto en p5
</p>
<button id="btnGuardar" style="display: none;">
btnGuardar
</button>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.