微信公众号开发实例之全局计时器的案例

图片.png

需求一：index.html里面的数据从后台获取并渲染在前端页面

代码：

//index.html页面JS代码如下
//判断openid是否已经获取
     if(sessionStorage.getItem("openid") == null){
          //获取用户的openId
          $.ajax({
             url : "getOpenId.action",
               dataType : "json",
               type : "get",
               data : "code="+GetQueryString("code"),
               success : function(data){
                   //保存openid
                   if(data != '')
                   sessionStorage.setItem("openid",data);  
                   //根据openid查询sa车辆
                   getCars(data);
               }
         })
     }else{
         getCars(sessionStorage.getItem("openid"))
     }

 //获取登记车辆
     function getCars(openid){
          $.ajax({
               url : "getCars.action",
               dataType : "json",
               type : "get",
               data : "openid="+openid,
               success : function(data){
                   if(data == -1){
                       $("#flag").val("1");
                       return;
                   };
                   if (data.length > 0) {
                       var laver = "";
                       for (var i = 0; i < data.length; i++) {
                           laver += '
';
                           laver += '
';
                           if(data[i].isCommit == 2){
                               laver += '';
                           }else if(data[i].isCommit == 1){
                               laver += '';
                           }else{
                               laver += '';
                           }
                           
                           laver += '
';
                           laver += ' 
';
                           
                           if(data[i].beacon != null){
                               laver += '
'+data[i].carNum+'
'+data[i].beacon+'';
                           }else{
                               laver += '
'+data[i].carNum+'

'; } laver += '

'; laver += '

'; laver += ''; } laver += "

" $('#car').html(laver); } } }) };

需求二：点击开始服务按钮，从零开始计算时间

图片.png

//先看一个单纯的倒计时的功能页面
  
  
  
     
     
 
     
 
  
  
  
   
  
   开始服务  
   
 
  
  
  

需求三：获取index页面的每一个时间和车牌的key,value值，共用全局计时器

图片.png

//server.html在项目里面的功能页面JS代码如下:

  
 

原文作者：祈澈姑娘
原文链接：https://www.jianshu.com/u/05f416aefbe1
创作不易，转载请告知

90后前端妹子，爱编程，爱运营，爱折腾。
坚持总结工作中遇到的技术问题，坚持记录工作中所所思所见，欢迎大家一起探讨交流。