Datum, Tag, Monat und Jahr erhöhen durch Klicken auf Nextdate Button in Javascript

Question

Ich vergrößere und verkleinere das Datum in meiner Anwendung, indem ich nextDay und previousDay date inkrementiere Aber sobald es das Monatsende erreicht wie 31, 30, 29 (Feb.), 28 (Feb) Dann sollte es sowohl den Monat als auch das Datum ändern. Aber es wächst weiter. Bis jetzt habe ich mit folgendem Code versucht habe

var today = new Date(); 
    var days = ["Sunday","Monday","Tuesday", 
       "Wednesday","Thursday","Friday","Saturday"]; 
    var months = ["January","February","March", 
       "April","May","June","July","August", 
       "September","October","November","December"]; 
    var nextDate = 0; 

Funktion set_todayDate() {

document.getElementById("todaysDate").innerHTML = 
         ""+days[today.getDay()]+", 
         "+months[today.getMonth()]+" 
         "+today.getDate()+" 
        "+today.getFullYear(); 

}

Für die nächste Datum und früheres Datum, nur ich bin zu erhöhen und variable

abnehmend

 function nextDateMethod(){ 

     nextDate++; 

    document.getElementById("todaysDate").innerHTML = ""+days[today.getDay() 
     +dayIncrement]+ 
     ", "+months[today.getMonth()]+" 
     "+(today.getDate()+dayIncrement)+""+today.getFullYear(); 
    } 



function prevDate(){ 
     nextDate--; 

document.getElementById("todaysDate"). 
    innerHTML = months[today.getMonth()]+", 
    "+(today.getDate()+nextDate)+" "+today.getFullYear(); 
    } 

Bitte jemand helfen mir

Answer 1

Try this:

if (!Date.now) { 
 
    Date.now = function() { 
 
    return new Date().getTime(); 
 
    } 
 
} 
 
var theDate = Date.now(); 
 

 
document.getElementById('date').innerText = getTheDate(theDate) 
 

 
document.getElementById('prev').addEventListener("click", function() { 
 
    theDate -= 86400000; 
 
    document.getElementById('date').innerText = getTheDate(theDate) 
 
}) 
 
document.getElementById('next').addEventListener("click", function() { 
 
    theDate += 86400000; 
 
    document.getElementById('date').innerText = getTheDate(theDate) 
 
}) 
 

 
function getTheDate(getDate) { 
 
    var days = ["Sunday", "Monday", "Tuesday", 
 
    "Wednesday", "Thursday", "Friday", "Saturday" 
 
    ]; 
 
    var months = ["January", "February", "March", 
 
    "April", "May", "June", "July", "August", 
 
    "September", "October", "November", "December" 
 
    ]; 
 
    var theCDate = new Date(getDate); 
 
    return days[theCDate.getDay()] + ', ' + theCDate.getDate() + '-' + months[theCDate.getMonth()] + '-' + theCDate.getFullYear(); 
 
}

<div id="date" style="height:100px; width:300px;"> 
 
</div> 
 
<button id="prev"> 
 
    <</button> 
 
    <button id="next">></button>

Answer 2

Ich sehe nicht, warum Ihr Code Monat automatisch aktualisieren sollte, wenn Datum 30 oder 31 oder so erreicht hat. Sie nehmen die Funktion getDate() und gibt eine Zahl zurück. Dann erhöhen oder verringern Sie es um 1. Es wird einfach wie var x=y+z handeln. Sie müssen entweder das Objekt Date manipulieren oder das System Monate, Schaltjahre usw. manuell konfigurieren. Ich habe das Date Reference Objekt unter http://www.w3schools.com/jsref/jsref_obj_date.asp überprüft und es scheint, dass Sie keine eingebaute Funktion wie addDays() wie in C# haben. Ich denke, Sie müssen die Kalenderregel manuell implementieren. Und auch, Bitte erwähnen Sie, wo Sie deklariert und initialisiert nextDate

Answer 3

Hier ist eine einfache Funktion eine beliebige Anzahl von Tagen zu einem bestimmten Zeitpunkt hinzuzufügen, wird der Trick mit dem setDate Methode des Datumsobjekt

function addDays(date, days) { 
    var result = new Date(date); 
    result.setDate(result.getDate() + days); 
    return result; 
} 

EDIT : seit wandelbar das Datum Klasse ist, können Sie auch eine Methode hinzufügen, die zukünftige Verwendung

Date.prototype.addDays = function(days) { 
    this.setDate(this.getDate() + parseInt(days)); 
    return this; 
}; 

Answer 4

Nun, versuchen Sie dies (Im Folgenden finden Sie die Laufprobe) zu erleichtern:

var today = new Date(); 
 
date = today.getDate(); 
 
month= today.getMonth(); 
 
year= today.getFullYear(); 
 
month = month+1; 
 

 
$("#Prev").click(function(){ 
 
    date = date -1; 
 
    if(date<1){ 
 
    month = month -1; 
 
    if(month == 0){ 
 
     year = year -1; 
 
     date = 31; 
 
     month = 12; 
 
     } else{ 
 
     if(month == 2){ 
 
     date = 28 
 
     } else if(month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12){ 
 
     date = 31 
 
     } else{ 
 
     date = 30 
 
     } 
 
     } 
 
    } 
 
    $("#displayDate")[0].innerHTML = date + "/" + month + "/" + year; 
 
}); 
 

 
$("#Next").click(function(){ 
 
    date = date + 1; 
 
    if(date>28 && month == 2){ 
 
    date = 1; 
 
    month = 3; 
 
} 
 
    if(date> 30 && (month == 4 || month == 6 || month == 9 || month == 11)){ 
 
    date = date +1; 
 
    month = month +1; 
 
    } else if (date> 31){ 
 
    date =1; 
 
    month = month+1; 
 
    if(month >12){ 
 
    year = year +1; 
 
     month= 1; 
 
     date = 1; 
 
    } 
 
    } 
 
    
 
    $("#displayDate")[0].innerHTML = date + "/" + month + "/" + year; 
 
}); 
 

 
$("#displayDate")[0].innerHTML = date + "/" + month + "/" + year;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div><button id="Prev">Prev</button><div id="displayDate"></div><button id="Next">Next</button></div>

Hinweis: Bedingung für Leap year ist noch nicht lassen Sie mich hinzugefügt wissen, ob es die ich auch dann beantworten erwartet ist hinzuzufügen.

Hope this helfen Ihnen :)

Answer 5

Es ist eine sehr gepflegte Bibliothek, genannt moment.js, die eine Menge Datum Manipulation Griffe Aufgaben und bietet verschiedene bequeme Möglichkeiten zur Anzeige von Daten. Die Webseite und die Dokumentation sind sehr gut gemacht, daher denke ich, dass es sich lohnt, ihre Bemühungen zu betrachten.

So würde die angeforderte Aufgabe, den Tag eines Datums zu erhöhen, im Moment aussehen.js:

var new_date_str = moment().add(1, 'days').format("dd, MMMM, D, YYYY"); 

diese Geige für ein volles Lauf Beispiel sehen: https://jsfiddle.net/me6pdk8L/2/