zoukankan      html  css  js  c++  java
  • AJAX制作JSON格式的实时更新数据的方法

    之前有写过这样的文章,但是出现了几个问题,第一,如果每秒都像数据库发送请求势必会造成服务器的压力过大,第二,如果使用JS的话,是不可以取得系统时间的,因为JS运行在客户端,所以只能取得客户端时间,

    如此的话,就需要在后台计算好时间差,然后前台得到时间差进行倒计时计算,并且更新数据

    JS代码如下:

     var i = 0;
        var ballNum = "";
        var flag = true;
        var timer_showCountDown = null;
        var leftTime;
    
        function showLeftTime(){
            ShowCountDown(leftTime);
        }
    
        /*-------------------------倒计时------------------------*/
        function ShowCountDown(sysTime) {
            console.warn(sysTime);
            var minute, second;
            if (isNaN(leftTime)) {
                leftTime = sysTime;
            } else {
                leftTime = sysTime;
            }
            minute = Math.floor(leftTime / (1000 * 60)) % 60;//
            second = Math.floor(leftTime / 1000) % 60;////把分钟和秒钟如果是一位数就变为两位数
            if (minute < 10) {
                minute = "0" + minute;
            }
            if (second < 10) {
                second = "0" + second;
            }
            //如果倒计时为负数,就设置为00:00
            if (leftTime < 0) {
                //$("#dendtime").html("00" + ":" + "00");//倒计时的时间,M表示分钟,S表示秒钟
    
            } else {
                $("#dendtime").html(minute + ":" + second);//倒计时的时间,M表示分钟,S表示秒钟
            }
            leftTime = (parseInt(leftTime) - 1000).toString();
        }
        /*-------------------------倒计时 end------------------------*/
    
        /*-------------------------显示开奖结果------------------------*/
        function showWinNum(msg) {
            $("#dendtime").html("00" + ":" + "00");//倒计时的时间,M表示分钟,S表示秒钟
    
            var numb1 = msg[0].getName.split("");//把期号分解成数组
    
            var numb2 = "";
            //把期号重新拆分处理
            for (var i = 0; i < numb1.length; i++) {
                numb2 = numb1[numb1.length - i - 1] + " " + numb2;
            }
            numb2 = numb2.substring(0, numb2.length - 1);//得到新的期号
    
            var numb3 = msg[0].getInfo.split(" ");//把球号分解成数组
            //这里暂时把跑号码球的方法变为直接显示号码球
            $("#num1").html("<li class="mt15">" + numb3[0] + "</li>");
            $("#num2").html("<li class="mt15">" + numb3[1] + "</li>");
            $("#num3").html("<li class="mt15">" + numb3[2] + "</li>");
            $("#num4").html("<li class="mt15">" + numb3[3] + "</li>");
            $("#num5").html("<li class="mt15">" + numb3[4] + "</li>");
            var numb4 = "";
            //把球号重新拆分处理
            for (var i = 0; i < numb3.length; i++) {
                numb4 = numb3[numb3.length - i - 1] + "----------------------------------------------------" + numb4;
            }
    
            numb4 = numb4.substring(0, numb4.length - 1);//得到新的球号
            ballNum = msg[0].getInfo;//将数据库里面取到的号码球的值存入一个变量
    
            $("#num").html(msg[0].getName);//期号
            $("#nextNum").html(msg[0].getNum);//下一期的期号
            //后台运行语音报号
            setTimeout(play("" + numb2 + "期开奖号码是" + numb4 + ",感谢您的关注"), 10);
        }
        /*-------------------------显示开奖结果 end------------------------*/
    
        /*-------------------------语音报号------------------------*/
        swfobject.embedSWF("Share/sampleDemo.swf", "sampleDemo", "0", "0", "9.0.0", "Share/expressInstall.swf");
        function play(c) {
            var item = {};
            item.text = c;
            swfobject.getObjectById("sampleDemo").onSynthsize(item);
        }
        /*-------------------------语音报号 end------------------------*/
    
    
        function setTimeOutPost() {
            $.ajax({
                type: "post",
                url: "/Lottery/DoDataMethod/GetKLCData.ashx",
                dataType: "json",
                async: true,
                success:
                    function (msg) {
                        leftTime = msg[0].getSysTime;
                        //首先倒计时
                        if (timer_showCountDown != null) {
                            clearInterval(timer_showCountDown);
                        }
                        timer_showCountDown = setInterval(showLeftTime, 1000);
    
                        //如果开奖结果有变化,则重新显示并报号
                        if (ballNum != msg[0].getInfo) {
                            showWinNum(msg);
                        }
    
                        //10秒调用一次AJAX方法更新数据
                        setTimeout(setTimeOutPost, 10000);
                    }
                ,
                error: function (req) {
                    //alert(req.readyState);//出错时提示出错状态
                }
            });
        }
        window.onload = function () {
            setTimeOutPost();
        }

    后台代码如下:

     context.Response.ContentType = "application/json";
            
            string[] Info = new string[10];
            string ConStr = ConfigurationManager.AppSettings["ConnectionString"].ToString();
            //得到上期开出的数据
            string GetDate = @"
                                    SELECT 
                                       TOP 1
                                       [ID]
                                      ,[LotteryID]
                                      ,[Name]
                                      ,[StartTime]
                                      ,[EndTime]
                                      ,[ChaseExecuted]
                                      ,[IsOpened]
                                      ,[WinLotteryNumber]
                                      ,[OpenOperatorID]
                                      ,[State]
                                      ,[StateUpdateTime]
                                      ,[OpenAffiche]
                                  FROM [T_Isuses]
                                  WHERE EndTime<getdate() and WinLotteryNumber<>'' and [IsOpened]=1
                                  ORDER BY [EndTime] desc
                                    ";
    
            //得到本期的时间
            string GetNowTime = @"
                                            SELECT 
                                            TOP 1
                                            [ID]
                                            ,[LotteryID]
                                            ,[Name]
                                            ,[StartTime]
                                            ,[EndTime]
                                            ,[ChaseExecuted]
                                            ,[IsOpened]
                                            ,[WinLotteryNumber]
                                            ,[OpenOperatorID]
                                            ,[State]
                                            ,[StateUpdateTime]
                                            ,[OpenAffiche]
                                        FROM [T_Isuses]
                                        WHERE IsOpened=0 and EndTime>(
                                            SELECT 
                                                TOP 1
                                                [EndTime]
                                            FROM [T_Isuses]
                                            WHERE EndTime<getdate() and WinLotteryNumber<>'' and [IsOpened]=1 and LotteryID=79
                                            ORDER BY [EndTime] desc
                                        ) and LotteryID=79 order by Name
                                    ";
    
            using (SqlConnection conn = new SqlConnection(ConStr))
            {
                conn.Open();
                SqlCommand comm = new SqlCommand(GetDate, conn);
                SqlDataReader reader = comm.ExecuteReader();
    
                while (reader.Read())
                {
                    Info[0] = reader["WinLotteryNumber"].ToString();
                    Info[1] = reader["Name"].ToString();
                    Info[2] = (Convert.ToInt32(Info[1].ToString().Substring(7, 2)) + 1).ToString();
                    if(Info[2].Length<=1)
                    {
                        Info[2] = "0" + Info[2];
                    }
                }
                reader.Close();
            }
            using (SqlConnection Nowconn = new SqlConnection(ConStr))
            {
                Nowconn.Open();
                SqlCommand nowComm = new SqlCommand(GetNowTime, Nowconn);
                SqlDataReader NowReader = nowComm.ExecuteReader();
                while (NowReader.Read())
                {
                    Info[3] = NowReader["EndTime"].ToString();
                }
                NowReader.Close();
            }
            TimeSpan dtime = Convert.ToDateTime(Info[3]) - Convert.ToDateTime(System.DateTime.Now);//开奖时间减去系统时间
            var outTime = (dtime.Minutes * 60000) + (dtime.Seconds * 1000) + 278000;//结果换算成毫秒数
            string obj = "[{"getInfo":"" + Info[0] + "","getName":"" + Info[1] + "","getNum":"" + Info[2] + "","getSysTime":"" + outTime + ""}]";
            context.Response.Write(obj);

     需要注意的是JSON格式的数据返回的时候要带中括号,不然前台页面会找不到数据的

  • 相关阅读:
    浏览器控制台获取百度文库文章内容
    使用python登录CNZZ访问量统计网站,然后获取相应的数据
    使用Python登录腾讯MTA数据分析平台,然后获取相关数据
    使用python读写excel
    python将json转csv
    TCP/IP协议
    PHP smarty
    PHP入门及面向对象
    PHP概览
    PHP整体概览
  • 原文地址:https://www.cnblogs.com/llcdbk/p/4078071.html
Copyright © 2011-2022 走看看