addclass - jQuery - Check if div has not class after add class -
i want jquery check div if has not class after add class:
here add class code:
$('#test').each(function (e) { $(this).click(function () { $(this).addclass('rotate'); }); then, want check if #test div has not .rotate class:
$('#test').not('.rotate').mouseenter(function () { $('#test').removeclass('rotate'); }); but not working.
assuming use classes rather ids (since ids must unique in document), sounds you're saying want add rotate class elements when they're clicked, , remove when elements receive mouseenter.
delegated handling best bet that:
// clicking on .test isn't .rotate adds .rotate $("body").on("click", ".test:not(.rotate)", function() { $(this).addclass("rotate"); }); // mouseenter on .test.rotate removes .rotate $("body").on("mouseenter", ".test.rotate", function() { $(this).removeclass("rotate"); }); that hooks events on body element, fires them when event travelled through element matching given selector. useful when you're adding/removing elements or adding/removing things (like rotate class) use determine whether hook event. since test happens when event occurs, doesn't matter there aren't (in example below, anyway) elements match selector initially; there later, when matters.
full example: live copy
<!doctype html> <html> <head> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <meta charset=utf-8 /> <title>delegated</title> <style> .rotate { color: green; } </style> </head> <body> <p>click turn green ('.rotate'), mouseenter green 1 remove it</p> <div class="test">one</div> <div class="test">two</div> <div class="test">three</div> <div class="test">four</div> <script> // clicking on .test isn't .rotate adds .rotate $("body").on("click", ".test:not(.rotate)", function() { $(this).addclass("rotate"); }); // mouseenter on .test.rotate removes .rotate $("body").on("mouseenter", ".test.rotate", function() { $(this).removeclass("rotate"); }); </script> </body> </html>
Comments
Post a Comment