Check if body has class using hasClass jQuery

Question

I'm using Twitter Bootstrap modal. When the modal is opened, it adds a class '.modal-open' to the body. When it closes, it removes this class.

I'm trying to identify when the body element has this class, but it doesn't work:

$(document).ready(function() {

if($('body').hasClass('modal-open')) {
    console.log('open');
} else {
    console.log('closed');
}       

});


<img src="img/projects/kitty.jpg" width="100%" height: "auto" data-toggle="modal" data-target=".kitty_modal">

When click the image, it shows modal. The code that makes the modal open is from bootstrap. I just want to remove overflow when the class 'modal-open' is added, so I can scroll the modal.

What's wrong with the existing code that you have? Which console statement is logged? Does the modal open on document ready? I doubt it... — War10ck, Aug 06 '14 at 15:56
You must add a click() event on the button which you click to open the modal, simply add this code in. — Superdrac, Aug 06 '14 at 15:59
If you show the rest of your relevant code (especially any code that opens the modal), you will get better results/answers :) — Gone Coding, Aug 06 '14 at 16:01
Thanks. I solved the problem with the question @undefined added. — Ana Claudia, Aug 06 '14 at 16:20

score -1 · Answer 1 · answered Aug 06 '14 at 16:04

-1

Maybe something like this? I think you are missing a #.

<script>
$(document).ready(function ()
{

    if ($('#body').hasClass('modal-open'))
    {
        alert("modal open");

    } else
    {
        alert("modal closed");

    }

});
</script>

answered Aug 06 '14 at 16:04

user1143550

33
8

Check if body has class using hasClass jQuery

1 Answers1