javascript - ejemplos - jquery datepicker format
¿Cómo agregar/restar fechas con JavaScript? (12)
Algo que estoy usando (se necesita jquery), en mi script lo necesito para el día actual, pero por supuesto puedes editarlo en consecuencia.
HTML:
<label>Date:</label><input name="date" id="dateChange" type="date"/>
<input id="SubtractDay" type="button" value="-" />
<input id="AddDay" type="button" value="+" />
JavaScript:
var counter = 0;
$("#SubtractDay").click(function() {
counter--;
var today = new Date();
today.setDate(today.getDate() + counter);
var formattedDate = new Date(today);
var d = ("0" + formattedDate.getDate()).slice(-2);
var m = ("0" + (formattedDate.getMonth() + 1)).slice(-2);
var y = formattedDate.getFullYear();
$("#dateChange").val(d + "/" + m + "/" + y);
});
$("#AddDay").click(function() {
counter++;
var today = new Date();
today.setDate(today.getDate() + counter);
var formattedDate = new Date(today);
var d = ("0" + formattedDate.getDate()).slice(-2);
var m = ("0" + (formattedDate.getMonth() + 1)).slice(-2);
var y = formattedDate.getFullYear();
$("#dateChange").val(d + "/" + m + "/" + y);
});
Quiero permitir que los usuarios agreguen y restan fechas fácilmente mediante JavaScript para navegar por sus entradas por fecha.
Las fechas están en el formato: "mm / dd / aaaa". Quiero que puedan hacer clic en el botón "Siguiente", y si la fecha es: "06/01/2012" y luego al hacer clic en siguiente, debería convertirse en: "06/02/2012". Si hacen clic en el botón ''prev'', debería convertirse en "31/05/2012".
Necesita hacer un seguimiento de los años bisiestos, el número de días en el mes, etc.
¿Algunas ideas?
El uso de PS AJAX para obtener la fecha del servidor no es una opción, es un poco lento y no la experiencia que el cliente desea para el usuario.
De la manera que me gusta, si tiene un objeto de fecha puede restarle otro objeto de fecha para obtener la diferencia. Los objetos de fecha se basan en milisegundos desde una fecha determinada.
var date1 = new Date(2015, 02, 18); // "18/03/2015", month is 0-index
var date2 = new Date(2015, 02, 20); // "20/03/2015"
var msDiff = date2 - date1; // 172800000, this is time in milliseconds
var daysDiff = msDiff / 1000 / 60 / 60 / 24; // 2 days
Así que así es como restas las fechas. Ahora si quieres agregarlos? date1 + date2 da un error. Pero si quiero obtener el tiempo en ms, puedo usar:
var dateMs = date1 - 0;
// say I want to add 5 days I can use
var days = 5;
var msToAdd = days * 24 * 60 * 60 * 1000;
var newDate = new Date(dateMs + msToAdd);
Al restar 0, se convierte el objeto de fecha en el formato de milisegundos.
El objeto JavaScript Date
puede ayudar aquí.
El primer paso es convertir esas cadenas en instancias de Date
. Eso es fácil de hacer:
var str = "06/07/2012"; // E.g., "mm/dd/yyyy";
var dt = new Date(parseInt(str.substring(6), 10), // Year
parseInt(str.substring(0, 2), 10) - 1, // Month (0-11)
parseInt(str.substring(3, 5), 10)); // Day
Entonces puedes hacer todo tipo de cálculos útiles. Las fechas de JavaScript comprenden los años bisiestos y tal. Usan un concepto idealizado de "día" que tiene exactamente 86,400 segundos de duración. Su valor subyacente es la cantidad de milisegundos desde The Epoch (medianoche, 1 de enero de 1970); puede ser un número negativo para las fechas anteriores a The Epoch.
Más en la página MDN en Date
.
También podría considerar el uso de una biblioteca como http://momentjs.com/ , que le ayudará con el análisis sintáctico, la fecha matemática, el formateo ...
Necesita usar getTime()
y setTime()
para agregar o restar el tiempo en un objeto de fecha de JavaScript. El uso de setDate()
y getDate()
dará lugar a errores cuando se alcanzan los límites de los meses 1, 30, 31, etc.
Usar setTime le permite establecer un desplazamiento en milisegundos, y dejar que el objeto Date calcule el resto:
var now=new Date();
var yesterdayMs = now.getTime() - 1000*60*60*24*1; // Offset by one day;
now.setTime( yesterdayMs );
Puede ser que esto podría ayudar
<script type="text/javascript" language="javascript">
function AddDays(toAdd) {
if (!toAdd || toAdd == '''' || isNaN(toAdd)) return;
var d = new Date();
d.setDate(d.getDate() + parseInt(toAdd));
document.getElementById("result").innerHTML = d.getDate() + "/" + d.getMonth() + "/" + d.getFullYear();
}
function SubtractDays(toAdd) {
if (!toAdd || toAdd == '''' || isNaN(toAdd)) return;
var d = new Date();
d.setDate(d.getDate() - parseInt(toAdd));
document.getElementById("result").innerHTML = d.getDate() + "/" + d.getMonth() + "/" + d.getFullYear();
}
</script>
---------------------- UI ---------------
<div id="result">
</div>
<input type="text" value="0" onkeyup="AddDays(this.value);" />
<input type="text" value="0" onkeyup="SubtractDays(this.value);" />
Puede utilizar el objeto de fecha nativo de JavaScript para realizar un seguimiento de las fechas. Le dará la fecha actual, le permitirá realizar un seguimiento de las cosas específicas del calendario e incluso ayudarlo a administrar diferentes zonas horarias. Puede agregar y restar días / horas / segundos para cambiar la fecha en que está trabajando o para calcular nuevas fechas.
eche un vistazo a esta referencia de objeto para obtener más información:
¡Espero que ayude!
Todas estas funciones para agregar fecha son incorrectas. Está pasando el mes incorrecto a la función Fecha. Más información sobre el problema: http://www.domdigger.com/blog/?p=9
Trabajar con fechas en javascript siempre es un poco complicado. Siempre termino usando una biblioteca. Moment.js y XDate son geniales:
Violín:
var $output = $(''#output''),
tomorrow = moment().add(''days'', 1);
$(''<pre />'').appendTo($output).text(tomorrow);
tomorrow = new XDate().addDays(-1);
$(''<pre />'').appendTo($output).text(tomorrow);
1.
Código:
var date = new Date(''2011'',''01'',''02'');
alert(''the original date is ''+date);
var newdate = new Date(date);
newdate.setDate(newdate.getDate() - 7); // minus the date
var nd = new Date(newdate);
alert(''the new date is ''+nd);
Usando Datepicker:
$("#in").datepicker({
minDate: 0,
onSelect: function(dateText, inst) {
var actualDate = new Date(dateText);
var newDate = new Date(actualDate.getFullYear(), actualDate.getMonth(), actualDate.getDate()+1);
$(''#out'').datepicker(''option'', ''minDate'', newDate );
}
});
$("#out").datepicker();
Material extra que podría ser útil:
getDate() Returns the day of the month (from 1-31)
getDay() Returns the day of the week (from 0-6)
getFullYear() Returns the year (four digits)
getHours() Returns the hour (from 0-23)
getMilliseconds() Returns the milliseconds (from 0-999)
getMinutes() Returns the minutes (from 0-59)
getMonth() Returns the month (from 0-11)
getSeconds() Returns the seconds (from 0-59)
Buen enlace: MDN Date
//In order to get yesterday''s date in mm/dd/yyyy.
function gimmeYesterday(toAdd) {
if (!toAdd || toAdd == '''' || isNaN(toAdd)) return;
var d = new Date();
d.setDate(d.getDate() - parseInt(toAdd));
var yesterDAY = (d.getMonth() +1) + "/" + d.getDate() + "/" + d.getFullYear();
$("#endDate").html(yesterDAY);
}
$(document).ready(function() {
gimmeYesterday(1);
});
puedes probar aquí: http://jsfiddle.net/ZQAHE/
startdate.setDate(startdate.getDate() - daysToSubtract);
startdate.setDate(startdate.getDate() + daysToAdd);
var date = new Date(''your date string here''); // e.g. ''2017-11-21''
var newdate = new Date(date.getTime() + 24*60*60*1000 * days) // days is the number of days you want to shift the date by
Esta es la única solución que funciona confiablemente al sumar / restar a través de meses y años. Se dio cuenta de esto después de pasar demasiado tiempo rebuscando con los métodos getDate y setDate, tratando de ajustar los cambios de mes / año.
decasteljau (en este hilo) ya ha respondido esto, pero solo quiere enfatizar la utilidad de este método porque el 90% de las respuestas recomiendan el enfoque getDate y setDate.