Use Jquery to implement the daily sign-in function and jquery to implement sign-in
I always wanted to implement a sign-in function, but Baidu didn't have what I wanted. So I integrated the plug-in layerModel I previously wrote through the materials found on the Internet, it's good for everyone to entertain and entertain!
Calendar. js
Var calUtil = {getDaysInmonth: function (iMonth, iYear) {var dPrevDate = new Date (iYear, iMonth, 0); return dPrevDate. getDate () ;}, bu1_cal: function (iYear, iMonth) {var aMonth = new Array (); aMonth [0] = new Array (7 ); aMonth [1] = new Array (7); aMonth [2] = new Array (7); aMonth [3] = new Array (7 ); aMonth [4] = new Array (7); aMonth [5] = new Array (7); aMonth [6] = new Array (7); var dCalDate = new Date (IYear, iMonth-1, 1); var iDayOfFirst = dCalDate. getDay (); var iDaysInMonth = calUtil. getDaysInmonth (iMonth, iYear); var iVarDate = 1; var d, w; aMonth [0] [0] = "day "; aMonth [0] [1] = "1"; aMonth [0] [2] = "2"; aMonth [0] [3] = "3 "; aMonth [0] [4] = "4"; aMonth [0] [5] = "5"; aMonth [0] [6] = "6 "; for (d = iDayOfFirst; d <7; d ++) {aMonth [1] [d] = iVarDate; iVarDate ++;} for (w = 2; w <7; w ++) {for (d = 0; D <7; d ++) {if (iVarDate <= iDaysInMonth) {aMonth [w] [d] = iVarDate; iVarDate ++ ;}} return aMonth ;}, ifHasSigned: function (signList, day) {var signed = false; $. each (signList, function (index, item) {if (item. signDay = day) {signed = true; return false ;}}); return signed ;}, drawCal: function (iYear, iMonth, signList) {var myMonth = calUtil. bustmcal (iYear, iMonth); var htmls = new Array (); Htmls. push ("<div class = 'sign _ main' id = 'sign _ lay'>"); htmls. push ("<div class = 'sign _ succ_calendar_title '>"); // htmls. push ("<div class = 'calendar _ month_next '> </div>"); // htmls. push ("<div class = 'calendar _ month_prev '> </div>"); htmls. push ("<div class = 'calendar _ month_span '> August 1, April 2015 </div>"); htmls. push ("</div>"); htmls. push ("<div class = 'sign' id = 'sign _ cal '>"); htmls. push ("<table>"); htmls. push ("<tr> "); Htmls. push ("<th>" + myMonth [0] [0] + "</th>"); htmls. push ("<th>" + myMonth [0] [1] + "</th>"); htmls. push ("<th>" + myMonth [0] [2] + "</th>"); htmls. push ("<th>" + myMonth [0] [3] + "</th>"); htmls. push ("<th>" + myMonth [0] [4] + "</th>"); htmls. push ("<th>" + myMonth [0] [5] + "</th>"); htmls. push ("<th>" + myMonth [0] [6] + "</th>"); htmls. push ("</tr>"); var d, w; for (w = 1; w <7; w ++) {htmls. push ("<tr>" ); For (d = 0; d <7; d ++) {var ifHasSigned = calUtil. ifHasSigned (signList, myMonth [w] [d]); console. log (ifHasSigned); if (ifHasSigned) {htmls. push ("<td class = 'on'>" + (! IsNaN (myMonth [w] [d])? MyMonth [w] [d]: "") + "</td>");} else {htmls. push ("<td>" + (! IsNaN (myMonth [w] [d])? MyMonth [w] [d]: "") + "</td>") ;}} htmls. push ("</tr>");} htmls. push ("</table>"); htmls. push ("</div>"); htmls. push ("</div>"); return htmls. join ('');}};
Sign.css
.singer_r_img{display:block;width:114px;height:52px;line-height:45px;background:url(images/sing_week.gif) right 2px no-repeat;vertical-align:middle;*margin-bottom:-10px;text-decoration:none;}.singer_r_img:hover{background-position:right -53px;text-decoration:none;}.singer_r_img span{margin-left:14px;font-size:16px;font-family:'Hiragino Sans GB','Microsoft YaHei',sans-serif !important;font-weight:700;color:#165379;}.singer_r_img.current{background:url(images/sing_sing.gif) no-repeat 0 2px;border:0;text-decoration:none;}.sign table{border-collapse: collapse;border-spacing: 0;width:100%;}.sign th,.sign td {width: 30px;height: 40px;text-align: center;line-height: 40px;border:1px solid #e3e3e3;}.sign th {font-size: 16px;}.sign td {color: #404040;vertical-align: middle;} .sign .on {background: url(images/sign_have.gif) no-repeat center;}.calendar_month_next,.calendar_month_prev{width: 34px;height: 40px;cursor: pointer;background:url(images/sign_arrow.png) no-repeat;}.calendar_month_next {float: right;background-position:-42px -6px;}.calendar_month_span {display: inline;line-height: 40px;font-size: 16px;color: #656565;letter-spacing: 2px;font-weight: bold;}.calendar_month_prev {float: left;background-position:-5px -6px;}.sign_succ_calendar_title {text-align: center;width:398px;border-left:1px solid #e3e3e3;border-right:1px solid #e3e3e3;background:#fff;}.sign_main {width: 400px;/**background-color: #FBFEFE;**/border-top:1px solid #e3e3e3;font-family: "Microsoft YaHei",SimHei;display: none;}
Sign. jsp
<% @ Page language = "java" import = "java. util. *" pageEncoding = "UTF-8" %> <! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
SignController. java
Package com. controller; import java. util. date; import java. util. list; import javax. servlet. http. httpServletRequest; import javax. servlet. http. httpServletResponse; import org. springframework. beans. factory. annotation. autowired; import org. springframework. stereotype. controller; import org. springframework. web. bind. annotation. requestMapping; import org. springframework. web. servlet. modelAndView; import com. common. framework. controller. baseController; import com. common. util. requestUtil; import com. model. entity. signEntity; import com. model. service. signService; @ Controller @ RequestMapping ("/sign") public class SignController extends BaseController {@ Autowired private SignService signService; @ RequestMapping ("/doSign") public ModelAndView doSign (HttpServletRequest request, httpServletResponse response) {ModelAndView view = super. createJsonView (); try {// first query whether boolean ifHasSigned = signService has been signed in. ifHasSigned (); if (ifHasSigned) {view. addObject ("result", "1");} else {SignEntity signEntity = new SignEntity (); Date signDate = new Date (); signEntity. setSignTime (signDate); signEntity. setSignDay (Long. valueOf (signDate. getDate (); signEntity. setSignIp (RequestUtil. getIpAddr (request); signEntity. setSigner ("zhoukun"); signService. signTX (signEntity); view. addObject ("result", "0");} List <SignEntity> signList = signService. listSign (); view. addObject ("signList", signList);} catch (Exception e) {e. printStackTrace ();} return view;} public static void main (String [] args) {System. out. println (new Date (). getDate ());}}
Demo diagram:
The above is all the content of this article. I hope you will like it.