buenos días. Estoy con un calendario con html y javascript, y me gustaría que al hacer click en un día me abriera otro html que tengo indicándome el año, mes y día que he seleccionado anteriormente.
var actual=newactual = new Date();
function mostrarCalendario(year, month)
{
var now var= now=newnew Date(year, month - 1, 1);
var last var= last=newnew Date(year, month, 0);
var primerDiaSemana var= primerDiaSemana=(now.getDay()==0 == 0) ? 7 : now.getDay();
var ultimoDiaMes var= ultimoDiaMes=lastlast.getDate();
var dia=0;
dia = 0;
var resultado="<tr>";
resultado = "<tr>";
var diaActual=0;
diaActual = 0;
console.log(ultimoDiaMes);
var a=0;
a = 0;
var b=b = ++a;
var last_cell=primerDiaSemana+ultimoDiaMes;
last_cell
= primerDiaSemana + ultimoDiaMes;
// hacemos un bucle hasta 42, que es el máximo de valores que puede
// haber... 6 columnas de 7 dias
for (var i=1;i<=42;i++)
{
i = 1; i <= 42; if(i==primerDiaSemanai++) {
if (i == primerDiaSemana) {
// determinamos en que dia empieza
dia = dia=1;1;
}
if(i<primerDiaSemana)
(i < primerDiaSemana) {
// celda mes anterior y siguiente
resultado += resultado+="<td"<td class='ayer'><a class='ayer' href='javascript:select_pordias();'>"+;'>" + (ultimoDiaMes - (primerDiaSemana - i - 1))+"< + "</a></td>";
} else if (i>=last_celli >= last_cell) {
if (i % 7 == 0) {
resultado += resultado+="<td"<td class='post' style='color: #fd9292'><a class='red' href='javascript:select_pordias();'>"+a+++"<;'>" + a++ + "</a></td>";
} else {
resultado += resultado+="<td"<td class='post' style='color: #cccccc'><a class='post' href='javascript:select_pordias();'>"+a+++"<;'>" + a++ + "</a></td>";
}
}
else {
// mostramos el dia
if (dia == if(dia==actualactual.getDate() && month==actualmonth == actual.getMonth()+1 + 1 && year==actualyear == actual.getFullYear())
resultado += resultado+="<td"<td class='hoy' ><a class='hoy' href='javascript:select_pordias();'>"+dia+"<;'>" + dia + "</a></td>";
else
resultado += resultado+="<td><a"<td><a class='negro' href='javascript:select_pordias();'>"+dia+"<;'>" + dia + "</a></td>";
dia++;
}
if(i%7==0)
(i % 7 == 0) {
if (dia > if(dia>ultimoDiaMesultimoDiaMes)
break;
resultado += resultado+="<tr><"<tr></tr>\n";
}
}
resultado += resultado+="<"</tr>";
var meses var= meses=ArrayArray("ENERO", "FEBRERO", "MARZO", "ABRIL", "MAYO", "JUNIO", "JULIO", "AGOSTO", "SEPTIEMBRE", "OCTUBRE", "NOVIEMBRE", "DICIEMBRE");
// Calculamos el siguiente mes y año
nextMonth = nextMonth=month+1;
month + 1;
nextYear=year;
nextYear = year;
if (month+1>12)
month + 1 > 12) {
nextMonth = nextMonth=1;1;
nextYear = year + nextYear=year+1;1;
}
// Calculamos el anterior mes y año
prevMonth = month prevMonth=month- 1;
prevYear = prevYear=year;year;
if (month -1<1)
1 < 1) {
prevMonth = prevMonth=12;12;
prevYear = year prevYear=year- 1;
}
if (month+1>12month + 1 > 12)
{
meses[month]=meses[month] = meses[0];
}
if (month+1>12month + 1 > 12)
{
meses[month+1]= meses[1];
meses[month + 1] = }meses[1];
}
if (month >=11>= 11 && month <12< 12) {
meses[month] meses[month]== meses[11];
meses[month+1]=meses[month meses[0];
+ 1] = meses[0];
}
if (month -1<1 1 < 1) {
meses[month -2]=meses[11]; 2] = meses[11];
meses[month-3]=meses[10];
- 3] = }meses[10];
}
if (month - 1 >0> 0 && month - 1 <=1<= 1) {
meses[month-2]=meses[0];
meses[month-3]=meses[11];
2] = }meses[0];
//document.getElementById("calendar").getElementsByTagName("caption")[0].innerHTML="<div>"+meses[month-1]+"meses[month /- "+year+"</div><div><a3] onclick='mostrarCalendario("+prevYear+","+prevMonth+")'><</a></div><div><a= onclick='mostrarCalendario("+nextYear+","+nextMonth+")'>></a></div>";meses[11];
}
document.getElementById("calendar").getElementsByTagName("tbody")[0].innerHTML=resultado;
innerHTML = resultado;
document.getElementById("calendar").getElementsByTagName("caption")[0].innerHTML="<div>"+year+"<innerHTML = "<div>" + year + "</div><div>"+meses[monthdiv><div>" + meses[month -1]+"< 1] + "</div><div><a onclick='mostrarCalendario("+prevYear+"" + prevYear + ","+prevMonth+"" + prevMonth + ")'><</a></div><div><a onclick='mostrarCalendario("+nextYear+"" + nextYear + ","+nextMonth+"" + nextMonth + ")'>></a></div><div>"+meses[monthdiv><div>" + meses[month -3]+"< 3] + "</div><div>"+meses[month+1]+"<div><div>" + meses[month + 1] + "</div><div>"+meses[monthdiv><div>" + meses[month -2]+"</div><div>"+meses[month]+"< 2] + "</div>";
div><div>" + meses[month] + "</div>";
}
#calendar {
font-family: Arial;
font-size: 12px;
}
#calendar caption {
text-align: center;
padding: 5px 10px;
background-color: white;
font-weight: bold;
font-size: medium;
margin-bottom: 30px;
}
#calendar caption div:nth-child(1) {
margin-bottom: 10px;
text-align: center;
}
#calendar caption div:nth-child(2) {
display: inline;
margin-top: 5px;
width: 20%;
}
#calendar caption div:nth-child(3) {
text-align: left;
float: left;
color: #cccccc;
}
#calendar caption div:nth-child(4) {
text-align: right;
float: right;
color: #cccccc;
}
#calendar caption div:nth-child(5) {
float: left;
width: 20%;
color: #cccccc;
font-size: 10px;
}
#calendar caption div:nth-child(6) {
float: right;
width: 20%;
color: #cccccc;
font-size: 10px;
}
#calendar caption div:nth-child(7) {
float: left;
width: 20%;
color: #cccccc;
font-size: 14px;
}
#calendar caption div:nth-child(8) {
float: right;
width: 20%;
color: #cccccc;
font-size: 14px;
}
#calendar caption div:nth-child(3) a {
cursor: pointer;
}
#calendar caption div:nth-child(4) a {
cursor: pointer;
}
#calendar th {
background-color: white;
padding: 22px;
width: 40px;
}
#calendar td {
text-align: center;
padding: 2px 5px;
background-color: white;
font-size: 20px;
color: black;
}
#calendar td:nth-child(7) {
color: red;
}
#calendar .hoy {
background-color: grey;
color: black;
}
#calendar .ayer {
color: #cccccc;
}
#calendar .post {
color: #cccccc;
}
#calendar .negro {
color: black;
}
#calendar .red {
color: #fd9292;
}
#calendar td:nth-child(7) a {
color: red;
}
#calendar td:nth-child(7) a.red {
color: #fd9292;
}
a {
color: black;
text-decoration: none
}
<!DOCTYPE html>
<html lang="es">
<head>
<head>
<script src="js/semanal.js"></script>
<meta charset="utf-8">
<style></head>
#calendar {
font-family:Arial;<body>
font-size:12px;<center>
<table }id="calendar">
#calendar caption {<p>
text-align:center;<caption></caption>
padding:5px 10px;<thead>
background-color:white;<tr>
<th>LUNES</th>
font-weight:bold;<th>MARTES</th>
font-size:medium;<th>MIERCOLES</th>
margin-bottom: 30px;<th>JUEVES</th>
}<th>VIERNES</th>
#calendar caption div:nth-child(1) {margin-bottom: 10px; text-align: center;}<th>SABADO</th>
#calendar caption div:nth-child(2) { display: inline; margin-top: 5px; width: 20%;}<th>DOMINGO</th>
#calendar caption div:nth-child(3) {text-align: left; float: left; color: #cccccc; }</tr>
#calendar caption div:nth-child(4) {text-align: right; float: right; color: #cccccc; }</thead>
#calendar caption div:nth-child(5) { float: left; width: 20%; color: #cccccc; font-size: 10px;}<tbody>
#calendar caption div:nth-child(6) { float: right; width: 20%; color: #cccccc; font-size: 10px;}<script>
#calendar caption div:nth-child(7) { float: left; width: 20%; color: #cccccc; font-size: 14px;}
#calendarwindow.onload caption= div:nth-childfunction(8) { float: right; width: 20%; color: #cccccc; font-size: 14px;}
#calendar caption div:nth-child(3) a {cursor:pointer;}
#calendar caption div:nth-childmostrarCalendario(4actual.getFullYear() a {cursor:pointer;}
#calendar th {
background-color:white;
padding: 22px;
width:40px;
}
#calendar td {
text-align:center;
padding:2px 5px;
background-color:white;
font-size:20px;
color: black;
}
#calendar, td:nth-childactual.getMonth(7) {
color:red;
+ 1);}
#calendar .hoy {
background-color:grey;</script>
color: black;<script>
}
#calendar window.ayer {
color: #cccccc;
}
onclick #calendar= .postfunction() {
color: #cccccc;
}
#calendar .negro {
var getInput color:= black;prompt(+year);
}
#calendar localStorage.red {
color: #fd9292;
}
#calendar td:nth-childsetItem(7) a { color:red; }
#calendar"Year", td:nth-child(7getInput) a.red { color:#fd9292; }
a {color:black; text-decoration:none}
</style>
</head>
<body>
<center>
<table id="calendar">
<p>
<caption></caption>
<thead>
<tr>;
<th>LUNES</th><th>MARTES</th><th>MIERCOLES</th><th>JUEVES</th><th>VIERNES</th><th>SABADO</th><th>DOMINGO</th>}
</tr>
</thead>
<tbody>
<script>mostrarCalendario(actual.getFullYear(),actual.getMonth()+1);</script>
<script>
window.onclick = function() {
var getInput = prompt(+year);
localStorage.setItem("Year",getInput);
}
</script>tbody>
</tbody>
</table>
</center>
</body>
</html>