Can I check if Bootstrap Modal Shown / Hidden was?

Question

Can I check if Bootstrap Modal is currently showing / hidden programmatically?

Like bool a = if("#myModal").shown(); ?

I need true / false

Answer 1

 alert($('#myModal').hasClass('in')); 

It will return true if the modal is open.

Answer 2

The best method is given in the docs.

 $('#myModal').on('shown.bs.modal', function () { // will only come inside after the modal is shown }); 

for more information see http://getbootstrap.com/javascript/#modals

Answer 3

his old question, but anyway, something I used if someone was looking for the same

 if (!$('#myModal').is(':visible')) { // if modal is not shown/visible then do something } 

Answer 4

When is modal hide? we check the following:

 $('.yourmodal').on('hidden.bs.modal', function () { // do something here }) 

Answer 5

Use hasClass('in') . It will return true if the modal state is in the OPEN state.

eg:

 if($('.modal').hasClass('in')){ //Do something here } 

Answer 6

Officially:

 > ($("element").data('bs.modal') || {})._isShown // Bootstrap 4 > ($("element").data('bs.modal') || {}).isShown // Bootstrap <= 3 

{} used to avoid the case when the modal window is not yet open ( undefined returned). You can also set it to {isShown: false} to make it more {isShown: false} .

Answer 7

 if($('.modal').hasClass('in')) { alert($('.modal .in').attr('id')); //ID of the opened modal } else { alert("No pop-up opened"); } 

Answer 8

With Bootstrap 4:

 if ($('#myModal').hasClass('show')) { alert("Modal is visible") } 

Answer 9

It works for me

 
 if ($ ("# myModal"). css ("display")! = 'none' && $ ("# myModal"). css ("visibility")! = 'hidden') alert("modal shown");