Toggling an 'active' class with jQuery, the style remains when clicking button again but class removed in Firefox
I have a problem. - only in Firefox
When I use jQuery to toggle a class 'active' on a link. The active style remains if I click the link again. It remains visible until I click somewhere else on the page but only in Firefox yet the class has been removed.
CODE:
$('#quick-add-click').click( function() {
$(this).find('a').toggleClass('active');
});
Anyone having any similar issues? Is t开发者_如何学编程here a simple fix?
Are you using Mootools or is Mootools being loaded even if you're not using it (happens automatically with Joomla systems). I had a problem with Firefox/Mootools/VEMap (Bing Maps) maybe you're having a similar problem.
Couldn't reproduce it.
However, perhaps you can test if it works without toggle?
$('#quick-add-click').click( function() {
if($(this).find('a').hasClass('active')) {
$(this).find('a').removeClass('active');
} else {
$(this).find('a').addClass('active');
}
});
Minimal example, cannot see that behaviour on OSX Firefox
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style>
a.active { color: #f00; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script>
$(function() {
$('#quick-add-click').click(function() {
$(this).find('a').toggleClass('active');
});
});
</script>
</head>
<body>
<div id="quick-add-click">
<a href="#">Foobar</a>
</div>
</body>
</html>
Could you check with Firebug where that style comes from when active class is not present anymore?
OK so the way I fixed it (in a hacky way) was to add onfocus="blur()" to the anchor element
加载中,请稍侯......
精彩评论