Quiero ocultar mi contenido. Esta página contendría un formulario y un botón para procesar una imagen. Después de ingresar un valor en el formulario y presionar el botón, mis scripts procesarán la imagen y la página se cargará automáticamente. El resultado debe colocarse en un DIV , pero esto no será visible después de presionar el botón y cargar la página. El contenido debe mostrarse solo después de procesar la página y presionar el botón. ¿Cómo se puede lograr esto usando jQuery?
mi html
<button type="submit" class="btn btn-warning" id="submitBtn" >Submit</button> <div id="toggle-show" class="container"> <div class="row"><img class="result-single" src="{% static "/assets/fig/figure1.png" %}"> </div> </div>mis guiones
$(document).ready(function() { $('#toggle-show').hide(); $("#submitBtn").click(function(){ $("#toggle-show").show(); #show the pic })});
Puede usar sessionStorage para hacer esto.
Para obtener más información sobre sessionStorage: haga clic aquí
$(document).ready(function () { $('#toggle-show').hide(); $("#submitBtn").click(function () { sessionStorage.setItem("pic_visible", "true"); }); if (sessionStorage.getItem("pic_visible") == "true") { $("#toggle-show").show(); // sessionStorage.setItem("pic_visible", "false"); } }); ¡También puede usar sessionStorage.setItem("pic_visible", "false") dentro de la instrucción if para cambiar la visibilidad a falso al recargar la página por segunda vez!
violín JS (para un ejemplo de trabajo): haga clic aquí
También mire en: localStorage