Estoy trabajando en una aplicación web CRUD simple que consta de 3 páginas, una página de inicio/índice, 1 página para ver los datos guardados y 1 página para realizar cambios y guardar estos cambios en una base de datos indexada. En dos de estas páginas, invoco una función javascript simple para cambiar .style.display de "ninguno" a "bloquear" para mostrar un modal. Por alguna razón, solo funciona en una página. En la otra página (el código HTML que se muestra a continuación), el modal se muestra solo durante una fracción de segundo antes de que uno navegue a la página de destino.

 function modalOpen(){ let modal = document.getElementById("aModal"); modal.style.display = "block";}

El archivo javascript que contiene este código está vinculado en ambos archivos HTML. A continuación se muestra el código HTML correspondiente. La función se llama en la línea 5.

 <main> <form> .... <button id="bSubmitExercise" onclick="edit('all')">Änderungen speichern</button> <button id="bOpenDeleteModal" onclick="modalOpen()">Übung löschen</button> <button id="bBackToIndex" onclick="location.href='detailsExercise.html'">Zurück zur Übersicht</button> </form> </main> <article id="aModal" class="aModal"> <section class="sModalContent"> <h5 id="hExercisesName"></h5> <div class="dContModalButtons"> <button id="bModalConfirmDelete" class="bModal" onclick="deleteExercise()">Löschen</button> <button id="bModalClose" class="bModal" onclick="modalClose()">Fenster schließen</button> </div> </section> </article>

Cuando abro las herramientas de desarrollo de Chrome y llamo a la función modalOpen() desde la consola, el modal se muestra según lo previsto. Este comportamiento ocurre ya sea usando Chrome, Edge o cuando se crea como la aplicación Apache Cordova para dispositivos móviles con Android. Almacene en caché los datos guardados que se borraron varias veces en ambos navegadores. ¿Por qué (no) sucede esto?