Time query plug-in

Time query plug-in

I learned a lot from this project, and I feel a lot of benefits from my excellent colleagues. In the past few days, I have to sort out what I learned from the project, in case you cannot remember it, the blog garden is really my masterpiece, haha ..

I used a Time query plug-in from my colleague and recorded it first:

First, we need to introduce js files and css files, because I have used bootstrap to introduce a lot of files: ps: If you need a friend, you can directly tell me

 

<script src="jquery-1.11.2.min.js"></script><script src="bootstrap.min.js"></script><script src="moment.js"></script><script src="daterangepicker.js"></script><link href="bootstrap.min.css" rel="stylesheet" type="text/css" /><link href="daterangepicker-bs3.css" rel="stylesheet" type="text/css" /><link href="http://www.jq22.com/jquery/font-awesome.4.6.0.css"rel="stylesheet">

 

The following is the div part:

<Div class = "col-xs-12"> <! -- Date query component --> <label class = "col-sm-1 control-label tj"> Release Date: </label> <div class = "col-xs-4 tj"> <form class = "form-horizontal"> <fieldset> <div class = "control-group"> <div class = "controls"> <div class = "input-prepend input-group"> <span class = "add-on input-group-addon"> <I class = "glyphicon- calendar fa-calendar "> </I> </span> <input type =" text "readonly style =" width: 200px "name =" reservation "id =" reservation "class =" form-control "value =" SELECT query date "/> </div>> </fieldset> </form> </div>

The last part is the JS part:

<Script type = "text/javascript"> // Date query js component $ (document ). ready (function () {$ ('# reservation '). daterangepicker (null, function (start, end, label) {console. log (start. toISOString (), end. toISOString (), label) ;}); var rqstart = ""; var rqend = ""; // Date and Time Method $ (document ). ready (function () {$ ('input [name = "reservation"] '). daterangepicker ({/* format: 'yyyy-MM-DD ', startDate: '2017-01-01', endDate: '2017-12-31 '*/}, function (start, end, label) {// alert ('a date range was chosen: '+ start. format ('yyyy-MM-DD ') + 'to' + end. format ('yyyy-MM-DD '); start = start. format ('yyyy-MM-DD ');//. format () converts any data to the string end = end. format ('yyyy-MM-DD ');/* Add */rqstart = start; rqend = end ;}); </script>

Shows the effect.