wake-up-neo.com

Wie füge ich Datumsangaben mit JavaScript hinzu?

Ich möchte, dass Benutzer Datumsangaben mit JavaScript leicht hinzufügen und subtrahieren, um ihre Einträge nach Datum zu durchsuchen.

Die Daten haben das Format "mm/tt/jjjj". Ich möchte, dass sie auf die Schaltfläche "Weiter" klicken können. Wenn das Datum "06/01/2012" ist, dann auf Weiter klicken, sollte es "06/02/2012" werden. Wenn sie auf die Schaltfläche "prev" klicken, sollte es "31.05.2012" werden.

Es muss die Schaltjahre, die Anzahl der Tage im Monat usw. im Auge behalten.

Irgendwelche Ideen?

Die Verwendung von AJAX zum Abrufen des Datums vom Server ist keine Option, es ist etwas verzögert und nicht die Erfahrung, die der Benutzer für den Client wünscht.

66
Click Upvote

Code:

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);

Datepicker verwenden:

$("#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();​

JSFiddle Demo

Extra Sachen, die nützlich sein könnten:

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)

Gute Verbindung:MDN-Datum

88
Tats_innit

Sie müssen getTime() und setTime() verwenden, um die Zeit in einem Javascript-Date-Objekt hinzuzufügen oder zu subtrahieren. Die Verwendung von setDate() und getDate() führt zu Fehlern, wenn die Grenzen der Monate 1, 30, 31 usw. erreicht werden.

Mit setTime können Sie einen Versatz in Millisekunden festlegen und das Date-Objekt den Rest bestimmen lassen:

var now=new Date();
var yesterdayMs = now.getTime() - 1000*60*60*24*1; // Offset by one day;
now.setTime( yesterdayMs );
36
decasteljau
startdate.setDate(startdate.getDate() - daysToSubtract);


startdate.setDate(startdate.getDate() + daysToAdd);
15

Hier hilft das JavaScript-Objekt Date.

Der erste Schritt besteht darin, diese Zeichenfolgen in Date-Instanzen zu konvertieren. Das geht ganz einfach:

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

Dann können Sie alle möglichen nützlichen Berechnungen durchführen. JavaScript-Daten verstehen Schaltjahre und dergleichen. Sie verwenden ein idealisiertes Konzept von "Tag", das genau86.400 Sekunden lang ist. Ihr zugrunde liegender Wert ist die Anzahl der Millisekunden seit The Epoch (Mitternacht, 1. Januar 1970); es kann eine negative Zahl für Datumsangaben vor The Epoch sein.

Mehr auf der MDN-Seite unter Date .

Sie könnten auch in Betracht ziehen, eine Bibliothek wie MomentJS zu verwenden, die bei der Analyse, Datumsberechnung, Formatierung usw. hilfreich ist.

7
T.J. Crowder
//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);
});

sie können es hier versuchen: http://jsfiddle.net/ZQAHE/

4
thetallone

Vielleicht kann das helfen

    <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);" />
4
yogi

Das Arbeiten mit Datumsangaben in Javascript ist immer etwas umständlich. Am Ende benutze ich immer eine Bibliothek. Moment.js und XDate sind beide großartig:

http://momentjs.com/

http://arshaw.com/xdate/

Geige:

http://jsfiddle.net/39fWa/

var $output = $('#output'),
    tomorrow = moment().add('days', 1);

$('<pre />').appendTo($output).text(tomorrow);

tomorrow = new XDate().addDays(-1);

$('<pre />').appendTo($output).text(tomorrow);

Das

3
benvds

Ich mag es, wenn Sie ein Datumsobjekt haben, können Sie ein anderes Datumsobjekt von ihm abziehen, um die Differenz zu erhalten. Datumsobjekte basieren auf Millisekunden ab einem bestimmten Datum. 

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

So subtrahieren Sie also Datumsangaben. Nun, wenn Sie sie hinzufügen möchten? date1 + date2 gibt einen Fehler aus. Aber wenn ich die Zeit in ms erhalten möchte, kann ich verwenden:

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);

Durch die Subtraktion von 0 wandeln Sie das Datumsobjekt in das Millisekunden-Format. 

2
Jake Rowsell
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

Dies ist die einzige Lösung, die zuverlässig arbeitet, wenn sie über Monate und Jahre addiert/subtrahiert wird. Dies wurde realisiert, nachdem viel zu viel Zeit damit verbracht hatte, sich mit den Methoden getDate und setDate herumzuschmuggeln und versuchte, sich für die Verschiebung von Monat/Jahr anzupassen.

decasteljau (in diesem Thread) hat dies bereits beantwortet, möchte aber nur die Nützlichkeit dieser Methode betonen, da 90% der Antworten da draußen die Methoden getDate und setDate empfehlen.

1

Alle diese Funktionen zum Hinzufügen von Datum sind falsch. Sie übergeben den falschen Monat an die Datumsfunktion. Weitere Informationen zum Problem: http://www.domdigger.com/blog/?p=9

1
rozsypal

Sie können das native JavaScript-Date-Objekt verwenden, um Datumsangaben zu verfolgen. Sie erhalten das aktuelle Datum, können Kalenderspezifische Informationen nachverfolgen und sogar die Verwaltung verschiedener Zeitzonen unterstützen. Sie können Tage/Stunden/Sekunden hinzufügen und subtrahieren, um das Datum zu ändern, mit dem Sie arbeiten, oder um neue Daten zu berechnen.

sehen Sie sich diese Objektreferenz an, um mehr zu erfahren:

Datum

Hoffentlich hilft das!

1
Logard

Das beste Datums-Dienstprogramm, das ich verwendet habe, ist date-fns .

  • Verwendet das native JavaScript-Format Date.
  • Unveränderlich; erstellt mit reinen Funktionen und gibt immer eine neue Datumsinstanz zurück, anstatt die übergebene zu ändern.
  • Modular; Importieren Sie nur die Funktionen, die Sie benötigen.

Paket-Manager:

"date-fns": "^1.30.1"

Code:

import { addDays, subDays } from 'date-fns'

let today = new Date()
let yesterday = subDays(today, 1)
let tomorrow = addDays(today, 1)

Einfach und großartig.

Etwas, das ich verwende (Jquery benötigt), in meinem Skript brauche ich es für den aktuellen Tag, aber Sie können es natürlich entsprechend bearbeiten.

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);
});

jsfiddle

0
user4029967