I'm having a weird problem.
I have a div that is hidden via css display:none, and each page has an id on the body tag. now when I load the pages by hitting enter in the address bar, or by a link to that page, everything loads normally, and the div that needs to be shown shows up.
But not if I hit the F5 button to refresh the page.
Super simple jquery, but doesn't work on F5? Bug? or something Im missing?
html
<body id="projects">
<ul id="sub_navigation" class="projects">
<li>stuff</li>
<li>stuff</li>
</ul>
css
#sub_navigation.projects{display:none;}
Jquery
$(document).ready(function(){
var page =开发者_C百科 $('body').attr('id');
$('#sub_navigation.'+page).show();
});
You're finding the element by the ID, so you shouldn't need the page ID. Try this instead:
$(document).ready(function(){
$("#sub_navigation").show();
});
I don't know how many elements use the projects
class name, but would it be possible to get the element by the class name?:
$(document).ready(function(){
$(".projects").show();
});
Or how about this maybe?:
$(document).ready(function(){
$("ul#sub_navigation.projects").show();
});
I would try this:
html - use a suffix on the navigation id to identify it uniquely.
<body id="projects">
<ul id="sub_navigation_projects" class="hidden">
<li>stuff</li>
<li>stuff</li>
</ul>
css
.hidden{display:none;}
javascript - create the unique navigation id based on the body id.
$(document).ready(function() {
var page = $('body').attr('id');
$('#sub_navigation_'+page).removeClasss('hidden');
});
精彩评论