JQuery menu with less code
I am using Jquery for a menu created like:
<div class="prof_info1">home</div><div class="prof_info2">info2</div><div class="prof_info3">info3</div>
And JQuery code like:
$(document).ready(function(){
$(".prof_info1").unbind("click").click(function(event) {
$("#main").html('<img src="img/spin.gif" class="spin">');
location.replace("?&id=<?=$id?>")
return false;
});
$(".prof_info2").unbind("click").click(function(event) {
$("#main").html('<img src="img/spin.gif" class="spin">');
$("#main").load('?a=2&id=<?=$id?>');
return false;
});
$(".prof_info3").unbind("click").click(function(event) {
$("#glavni").html('<img src="img/spin.gif" class="spin">');
$("#glavni").load('?a=3&id=<?=$id?>');
return false;
});
});
Is there an easier way to write this JQuery code and make it with less code? Sort of
if click somethind{
...
}elseif{
....}
+2
a source to share
2 answers
try this solution.
<div class="prof_info redirect">
<a href="?&id=1">home</a>
</div>
<div class="prof_info ajax">
<a href="?&id=1">info2</a>
</div>
<div class="prof_info ajax">
<a href="?&id=3">info3</a>
</div>
Js
$(document).ready(function(){
$(".prof_info a").click(function(event) {
$("#main").html('<img src="img/spin.gif" class="spin">');
if($(this).parent('.redirect').get(0)){
location.replace($(this).attr('href'));
}else{
$("#main").load($(this).attr('href'));
}
return false;
});
});
+4
a source to share
<div class="menu_clickable prof_info1" data-element="#main"
data-load="?&id=<?=$id?>">home</div>
$('.menu_clickable').unbind('click').click(function(){
$(this).attr('data-element').html('<img src="img/spin.gif" class="spin">');
$(this).attr('data-element').load($(this).attr('data-load'));
return false;
});
NTN
0
a source to share