The effect of "Week" can be displayed as the 2nd week of 2016

First on:

Action: A page forward, shown as the 1th week of 2016; Turn back one page, show the 3rd week of 2016

Action 2: Date associated with data

So much code just look at one place OK, here are three Div, respectively:

Previousdiv  Previous page ID

Nextdiv      next Page ID

Headertitlediv    Date Container ID   

Date is required to be placed in input, ID is title

Html:

<!--container of the date -        <Divclass= "Headerdiv">            <DivID= "Previousdiv"class= "Previousimgdiv"></Div>            <DivID= "Nextdiv"class= "Unnextimgdiv" ></Div>            <DivID= "Headertitlediv"class= "Titlediv"><inputID= "title"type= "text"style= "Background-color: #f0f0f0; border:none;font-size:20px;text-align:center;"/></Div>        </Div>

Note: Thetype of "Week" of input is text

Here is the JS section:

1. Custom variables

varPreviousdiv;varNextdiv;varHeadertitlediv;vartitle;//Spell DatevarCurrentweek =Theweek ();varDefaultweek =Theweek ();varCurrentYear =theyear ();varDefautlyear =theyear ();//Listen for click events on previous and next pagevarpreviousdivtapevent;varNextdivtapevent;

2. Initialization of variables:

$ (document). Ready (function() {Previousdiv= document.getElementById (' Previousdiv '); Nextdiv= document.getElementById (' Nextdiv '); Headertitlediv= document.getElementById (' Headertitlediv '); Title= document.getElementById (' title '); Title.value=Formartweek (); //Add a Click event to the previous page and listen to itPreviousdiv.addeventlistener (' Tap ', previousdivtapevent); $ (title). On (' Input ',function(){        if( This. Value.length = = 0){             This. Value.length = Formartweek (NewDate ()); }Else{            if(Checkcandonext ()) {fetchdate (); return;    }        }    }); }    

3, the day before the Monitoring event (fetchdate (); date associated with the data method, call this method, you can get the data associated with the date ):

function previousdivtapevent () {    resetnextevent ();     = ' Nextimgdiv ';     = Getpreviousweek (title.value);
    Fetchdate ();   Date associated with the data method, call this method, you can get the data associated with the date    fetchdate ();}

4, the next day to monitor the event:

function nextdivtapevent () {    resetpreviousevent ();     = Getnextweek ();    Fetchdate ();     if (checkcandonext) {        nextdiv.removeeventlistener (' tap ', nextdivtapevent);         return ;    }}

5, get last week, and return

function Getpreviousweek () {    // current week minus one week currentweek--;    currentweek--;     if (Currentweek < 1) {        currentyear--;         =n;    }     return Formartweek ();}

6. Get the next week and return

function Getnextweek () {    // current week plus one week master is next week    Currentweek + +;     // if the current weeks old is 52 weeks, full year, current year plus one year, New Year, first week    if (Currentweek >) {        + +;         = 1;    }     return Formartweek ();}

7, Judge, if the next page has data, then, you can click into the next page, if there is no data, the button is not clickable

 function   Checkcandonext () { if  (defaultweek <= currentweek && defautlyear <= CurrentYear) {T        Itle.value  = Formartweek ();        Nextdiv.classname  = ' unnextimgdiv ' ;        Nextdiv.removeeventlistener ( ' tap ' ,nextdivtapevent);  return  true  ;         else  {resetnextevent ();        Nextdiv.classname  = ' nextimgdiv ' ;  return  false  ; }}

8, reset the previous page of the monitoring event, the first button to add a picture class;

First delete the original event, plus the new event

function resetpreviousevent () {    = ' Previousimgdiv ';    Previousdiv.removeeventlistener (' tap ', previousdivtapevent);    Previousdiv.addeventlistener (' tap ', previousdivtapevent);}

9, reset the next page of listening events, the same way

function resetnextevent () {    = ' Nextimgdiv ';    Nextdiv.removeeventlistener (' tap ', nextdivtapevent);    Nextdiv.addeventlistener (' tap ', nextdivtapevent);}

10. Format the date and return it in a custom way

function Formartweek () {    return CurrentYear + "year First" + Currentweek + "Week";}

11. Get the current year

function theyear () {    varnew  Date ();     = now.getfullyear ();     return years;}

12, get the current week, and determine whether it is a leap year, for the number of days in February to calculate

functionTheweek () {varTotaldays = 0; now=NewDate (); Years=now.getyear ()if(Years < 1000) years+ = 1900varDays =NewArray (12); days[0] = 31; days[2] = 31; days[3] = 30; days[4] = 31; days[5] = 30; days[6] = 31; days[7] = 31; days[8] = 30; days[9] = 31; days[10] = 30; days[11] = 31; //determine if a leap year is calculated for the number of days in February    if(Math.Round (Now.getyear ()/4) = = Now.getyear ()/4) {days[1] = 29    } Else{days[1] = 28    }     if(Now.getmonth () = = 0) {totaldays= Totaldays +now.getdate (); } Else {        varCurmonth =Now.getmonth ();  for(varCount = 1; Count <= Curmonth; count++) {totaldays= Totaldays + days[count-1]; } totaldays= Totaldays +now.getdate (); }    //get the first few weeks    varWeek = Math.Round (TOTALDAYS/7); returnWeek;}

The above methods for the Sunday period require attention to the following points:

1. The type of input in HTML is text

   type= "text" style= "Background-color: #f0f0f0; border:none;font-size:20px;text-align:center;" /></div>

2. The previous page and the next page of the Click event, you can join the data associated with the method, when you click on the next page, automatically get the corresponding data

3. When adding the input event to the title, it is necessary to write a judgment: the current value = The return method for the Sunday period. If the next page has data, you can click to go to the next page:

function () {        if(this. Value.length = = 0)            {this.value.length = Formartweek ( New   Date ());        } Else {            if(checkcandonext ()) {                fetchdate ();                 return ;            }        }    });

The effect of "Week" can be displayed as the 2nd week of 2016