倒计时

原创 2015年11月20日 20:47:16

效果:


文件1:LongDay.php

<!DOCTYPE html PUBLIC>
<!--[if IE 7]>         <html class="no-js ie7"> <![endif]-->
<!--[if IE 8]>         <html class="no-js ie8"> <![endif]-->
<!--[if IE 9]>         <html class="no-js ie9"> <![endif]-->
<!--[if gt IE 9]><!--> <html class="no-js"> <!--<![endif]-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>新闻点评功能</title>
    <style>
    body {height:100px;font-size:16px;color:#048bcc;margin:5%;}
    a {text-decoration:none;}
    .divFrame {width:572px;border:solid 1px #666;background-color:#fafcff:}
    .divFrame .divTitle {padding:5px;background-color:#eee}
    .divFrame .divTitle span{padding:2px;padding-top:5px;font-family:黑体;font-size:14px;}
    .divFrame .divContent {padding:5px}
    .divFrame .divContent .clsShow {font-size:16px;}
    .divFrame .divContent .clsShow .ShowBottom{text-align:right;font-size:12px;color:#555;}
    .divFrame .divSubmit{padding:20px;}
    .divFrame .divSubmit .SubContent .SubBtn{padding-top:10px;padding-bottom:12px;font-size:12px;color:#555;font-weight:bold;}
    .btn {border:#666 1px solid;width:80px;}
    .txt {width:525px;margin-bottom:5px;margin-top:5px;}
    .clsError {margin-bottom:5px;margin-top:5px;}
    .clsTip {position:absolute;width:160px;text-align:center;font-size:13px;border:solid 1px #cc3300;padding:2px;margin-bottom:5px;background-color:#ffe0a3;}
    </style>
    <script src="js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
    $(function(){
        $("#divMsg").ajaxStart(function(){
            $(this).html("正在发送数据请求......").show(); //显示元素
        })
        $("#divMsg").ajaxStop(function(){
            $(this).html("数据处理完成。").hide(); //显示后再隐藏
        })
        //初始化点评数据
        LoadData();
        $("#Button1").click(function(){
            var strName = $("#txtName").val();
            var strContent = $("#txtContent").val();
            $.ajax({
                type:"GET",
                url:"addData.php",
                data:{name:strName,content:strContent},
                dataType:"html",
                success:function(msg){
                    alert(msg);
                    LoadData();
                    $("#txtName").val("");
                    $("#txtContent").val("");
                }
            })
        })
        //动态加载XML格式的点评数据
        function LoadData(){
            $.ajax({
                type:"GET",
                url:"CommentData.xml", //请求XML格式数据
                dataType:"xml",
                cache:false,
                success:function(data){
                    $(".divContent").empty();  //先清空标记中的内容
                    var strHTML = "";  //初始化保存内容变量
                    //如果没有找到数据
                    if ($(data).find("Data").length == 0){
                        strHTML = "<div style='text-align:center'>目前还没有找到点评数据!</div>";
                    }
                    //遍历获取的数据
                    $(data).find("Data").each(function(){
                        var $strUser = $(this);
                        strHTML += "<div class='clsShow'>";
                        strHTML += "<div class='ShowTitle'>网友游侠  <a href=''>" + $strUser.find("name").text() +"</a></div>";
                        strHTML += "<div class='ShowContent'>" + $strUser.find("content").text() +"</div>";
                        strHTML += "<div class='ShowBottom'>发送时间  " + $strUser.find("date").text() +"</div>";
                        strHTML += "</div>";
                    })
                    $(".divContent").html(strHTML); //显示处理后的数据
                }
            })
        }
    })
   
    </script>
</head>
<body>
  <div class="divFrame">
    <div class="divTitle">
        <span>最新点评</span>    
    </div>
    <div class="divContent">
    </div>
    <div class="divDay" style="text-align:center;">
    <?php
        $d1=strtotime("January 1 2016");
        $d2=ceil(($d1-time())/60/60/24);
        date_default_timezone_set("Asia/Shanghai"); //设置时区
        echo "今天是:".date("Y-m-d")." ".date("l")."<br/>";
        echo "现在时间是: " . date("h:i:sa")."<br/>";
        echo "距离2016年新年还有:" . $d2 ." 天"."<br/>";
    ?>
    </div>
    <div class="divSubmit">
        <div class="SubTitle">发表评论  
            <span id="divMsg" class="clsTip">正在发送数据请求......</span>
        </div>
        <div class="SubContent">
            <textarea id="txtContent" rows="6" class="txt"></textarea>
            <div class="SubBtn">
                <span style="float:left">用户名:<input id="txtName" type="text" class="txtName" /></span>
                <span style="float:right"><input id="Button1" type="button" value="发表" class="btn" /></span>
            </div>
        </div>
    </div>  
  </div>
</body>
</html>



文件2:addData.php
文件3:<span style="font-family: Arial, Helvetica, sans-serif;">CommentData.xml  动态创建</span>


版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

Android开发:验证码倒计时功能实现

前言现在好多个APP里面都有验证码倒计时按钮,实现方式大概有下面几种: 1.使用线程和Handler的方式,定时刷新倒计时数字,这种方式容易导致内存泄露,所以一般都使用弱引用,控制数字的刷新。 2、自...

微信小程序开发(3)--倒计时60获取验证码

微信小程序获取验证码

倒计时11天,苹果iOS强制HTTPS迫在眉睫

距离苹果iOS强制HTTPS只剩11天!11天后,苹果将关闭HTTP的大门

使用CountDownTimer类实现倒计时小闹钟

下面使用CountDownTimer类实现倒计时小闹钟,CountDownTimer类其实很简单,一般只需重写其onFinish和onTick方法就可以实现倒计时小闹钟,代码如下: MainActi...

Vue2.0进阶组件篇1 教你秒撸(短信倒计时组件)

原本我想隔个几天再发文章,刚好今天项目上线,环境有问题,导致只有干等,刚好要为公司打造一套属于公司自己的一系列功能组件,这个使命就交给我了,大家也一直叫我来点干货,说实话我只是一个湿货,肚子里干一点就...

自定义View实现倒计时功能

需求很简单,传入一个点击按钮,点击可实现倒计时功能,并且可以重复倒计时,使用自定义View的方式,在自定义VIew方法中传入被点击的View对象,用于控制倒计时的开始开关。描述可能有些琐碎,直接上代码...

Android倒计时功能的实现(CountDownTimer)

以前编程的时候,遇到倒计时的功能时,经常自己去写,但其实Android已经帮封装好了一个倒计时类CountDownTimer,其实是将后台线程的创建和Handler队列封装成为了一个方便的类调用。 ...

干货三:CountDownTimer倒计时工具类

概述毫无疑问,我们先来看下官方文档中给的介绍CountDownTimer官方定义如下: Schedule a countdown until a time in the future, with ...

setInterval(倒计时实例)和setTimeout的用法

实例: html页面
  • snn1410
  • snn1410
  • 2014年09月25日 10:39
  • 8257

赛马网基本算法之--日期倒计时

题目描述 在经济、科技日益发达的今天,人们对时间的把握越来越严格,对于一个一定影响力的公司的高管来说,他可能要将自己的行程提前安排到下个月。对于普通人来说,他也可能将几天之后的安排已经提前做好。...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:倒计时
举报原因:
原因补充:

(最多只允许输入30个字)