I am making a page in which when the user clicks on any option of a menu, it shows me the information of .html
the one that I select, said menu has labels <a>
and with the attribute href
that has the labels, with the implementation of Ajax, I show the .html
requested ones.
The question I have is if there is any way to optimize the code and avoid writing so much repeated Ajax code.
- Labels
<a>
and box where I show the.html
requested
<a href="ejemplo1">Ejemplo #1</a>
<a href="ejemplo1">Ejemplo #2</a>
<a href="ejemplo1">Ejemplo #3</a>
<div id="div_dinamico></div>
- ajax
$("a").click(function(e) {
e.preventDefault();
var href = $(this).attr('href');
switch(href)
{
case 'ejemplo1':
$.ajax({
url: 'ejemplo1.html',
success: function(data) {
$('#div_dinamico').html(data);
}
});
break;
case 'ejemplo2':
$.ajax({
url: 'ejemplo2.html',
success: function(data) {
$('#div_dinamico').html(data);
}
});
break;
case 'ejemplo3':
$.ajax({
url: 'ejemplo3.html',
success: function(data) {
$('#div_dinamico').html(data);
}
});
break;
default:
console.log("Ninguna opcion es valida.");
break;
}
});
He
switch
is too much you can only pass href to the urlExample: