Reputation: 11
I have this jquery code that dynamically loads an html page into a div when a user clicks on a link in a list.
Is there a way to disable one of the links if the user is already viewing the page it links to? Right now the loading animation is triggered every time the link is clicked even if the requested link is already showing.
I need the event to not trigger if the page it calls and loads is already displayed.
$('#navigation a').click(function(){
var toLoad = $(this).attr('href')+' #content';
$('#content').hide("slide",{direction:"up"},1000,loadContent);
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
function loadContent() {
$('#content').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#content').show("slide",{direction:"down"},1000);
}
return false;
});
Upvotes: 1
Views: 628
Reputation: 14600
You can add a custom class which will disable your clicked link. Like:
$('#navigation a').click(function(){
......
$(this).addClass('disabled');
....
}
But you would obivously need to somehow remove that class from other previously added links (so you won't disable whole menu after few clicks. So you could make some reset like:
$('#navigation a').click(function(){
......
$('#navigation a').removeClass('disabled');
$(this).addClass('disabled');
....
}
This is just a simple logic. I believe it can be optimized or written in different way.
Edit: Css class probably won't make it in this case. I am not sure, if you can use disable() on anchor tag. Or you can just execute different logic like using preventDefault on this link, but then you still need to keep track of disabled elements this way so you can enable them once another one is clicked.
Upvotes: 2