Tengo un modal múltiple en una página. Usé django para recorrer todas las miniaturas y cada vez que el usuario hace clic en la miniatura, la foto de tamaño completo aparecerá como un modal. Sin embargo, cuando trato de cerrar el modal, el telón de fondo permanece. Eso hace que el usuario no pueda hacer clic en cualquier parte de la pantalla. La otra cosa que me confundió es que mi modal funciona correctamente en el servidor local. Pero cuando lo pruebo en Pythonanywhere, comienza el problema. He adjuntado debajo de mi código. Gracias por la ayuda.

 <div class="container"> <div class="modal modal-class-{{c.uuid}} fade" id="modal-id-{{c.uuid}}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="{{c.uuid}}-exampleModalLabel">Gallery</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="modal-body"> <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel"> <div class="carousel-inner"> <div class="carousel-item active"> <img class="d-block w-100" src="{{c.chapter_photo.url}}" alt="First slide"> </div> </div> </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> </div> </div> </div> </div> </div>