asp.net gridview 显示倒计时

如下图，将截止时候和当前时间对比，显示剩余时间倒计时，实时显示，剩余多少天多少小时多少分多少秒

asp.net gridview 显示倒计时

14 个解决方案

#1

up,希望lz有确实答案之后，公布一下。

#2

没人回复吗

#3

DateTime dt1 = DateTime.Parse("截止时间");
       DateTime dt2 = DateTime.Now;
        TimeSpan ts = new TimeSpan();
        ts = dt1 - dt2;

#4



 //将时间减去1秒，计算天、时、分、秒 

               function SetTime(time) {

                   if (time> 0) {

                       time= time- 1;

                   } else {

                       $("剩余时间控件id").html("已结束");

                   }

               }

原谅我的放荡不羁

#5

这里是数据计算，要看你怎样实时显示了：
http://www.cnblogs.com/insus/p/3979118.html

#6

引用 3 楼 z_dota 的回复:

DateTime dt1 = DateTime.Parse("截止时间");
       DateTime dt2 = DateTime.Now;
        TimeSpan ts = new TimeSpan();
        ts = dt1 - dt2;

引用 4 楼 xiaozhihui5535 的回复:



 //将时间减去1秒，计算天、时、分、秒 

               function SetTime(time) {

                   if (time> 0) {

                       time= time- 1;

                   } else {

                       $("剩余时间控件id").html("已结束");

                   }

               }

原谅我的放荡不羁

你们这是要坑我么？
我是要在页面上无刷新显示倒计时，不是问怎么倒计时

#7

用timer,js脚本更新?

#8

引用 5 楼 insus 的回复:

这里是数据计算，要看你怎样实时显示了：
http://www.cnblogs.com/insus/p/3979118.html

这是sql ，不是我想要的，我要在界面列表上无刷新显示倒计时，页面打开了，当前页面要实时显示剩余时间

#9

引用 7 楼 Z65443344 的回复:

用timer,js脚本更新?

单个lable更新好更新，就是列表上面，每条数据都要显示

#10

看了一下你的需求，写了一个Demo，可以实现无刷新，原理是使用asp.net scriptManger+UpdatePanel+Timer实现的。
后台：



using System;

using System.Collections;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;


namespace WebApplication

{

    public partial class WebForm2 : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            if (!this.IsPostBack)

            {

                List<Times> list = new List<Times>();

                list.Add(new Times { TestTime = DateTime.Now });

                list.Add(new Times { TestTime = DateTime.Now.AddHours(-4) });

                list.Add(new Times { TestTime = DateTime.Now.AddDays(-2) });

                gvList.DataSource = list;

                gvList.DataBind();

            }

        }


        protected void Timer1_Tick(object sender, EventArgs e)

        {

            for (int i = 0; i < gvList.Rows.Count; i++)

            {

                if (gvList.Rows[i].RowType == DataControlRowType.DataRow)

                {

                    Label l = (Label)gvList.Rows[i].FindControl("Label1");

                    l.Text = (DateTime.Now - Convert.ToDateTime(gvList.Rows[i].Cells[0].Text)).ToString();

                }

            }

        }

    }

}

前台：



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication.WebForm2" %>


<!DOCTYPE html>


<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <div>

         <asp:ScriptManager ID="ScriptManager1" runat="server">

                        </asp:ScriptManager>

        <asp:GridView ID="gvList" runat="server" AutoGenerateColumns="False">

            <Columns>

                <asp:BoundField DataField="TestTime" HeaderText="时间" />

                <asp:TemplateField HeaderText="剩余时间">

                    <EditItemTemplate>

                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

                    </EditItemTemplate>

                    <ItemTemplate>

                        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

                            <ContentTemplate>

                                <asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick">

                                </asp:Timer>

                                <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

                            </ContentTemplate>

                            <Triggers>

                                <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />

                            </Triggers>

                        </asp:UpdatePanel>

                        

                        <br />

                    </ItemTemplate>

                </asp:TemplateField>

            </Columns>

        </asp:GridView>

    </div>

    </form>

</body>

</html>

我将剩余时间那列转换为了模板。
asp.net gridview 显示倒计时

实现效果我就不展示了，不明白的地方可以讨论一下。
PS：我没有将剩余时间转换为你要的格式，偷一下懒啦。。。

#11

引用 8 楼 happy09li 的回复:

Quote: 引用 5 楼 insus 的回复:

这里是数据计算，要看你怎样实时显示了：
http://www.cnblogs.com/insus/p/3979118.html

这是sql ，不是我想要的，我要在界面列表上无刷新显示倒计时，页面打开了，当前页面要实时显示剩余时间

同下面的效果，有问题吗？Insus.NET只录制了十几秒：
asp.net gridview 显示倒计时

#12

refer here:
http://www.cnblogs.com/insus/p/4062619.html

#13

引用 10 楼 luanjun123456 的回复:

看了一下你的需求，写了一个Demo，可以实现无刷新，原理是使用asp.net scriptManger+UpdatePanel+Timer实现的。
后台：



using System;

using System.Collections;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;


namespace WebApplication

{

    public partial class WebForm2 : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            if (!this.IsPostBack)

            {

                List<Times> list = new List<Times>();

                list.Add(new Times { TestTime = DateTime.Now });

                list.Add(new Times { TestTime = DateTime.Now.AddHours(-4) });

                list.Add(new Times { TestTime = DateTime.Now.AddDays(-2) });

                gvList.DataSource = list;

                gvList.DataBind();

            }

        }


        protected void Timer1_Tick(object sender, EventArgs e)

        {

            for (int i = 0; i < gvList.Rows.Count; i++)

            {

                if (gvList.Rows[i].RowType == DataControlRowType.DataRow)

                {

                    Label l = (Label)gvList.Rows[i].FindControl("Label1");

                    l.Text = (DateTime.Now - Convert.ToDateTime(gvList.Rows[i].Cells[0].Text)).ToString();

                }

            }

        }

    }

}

前台：



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication.WebForm2" %>


<!DOCTYPE html>


<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <div>

         <asp:ScriptManager ID="ScriptManager1" runat="server">

                        </asp:ScriptManager>

        <asp:GridView ID="gvList" runat="server" AutoGenerateColumns="False">

            <Columns>

                <asp:BoundField DataField="TestTime" HeaderText="时间" />

                <asp:TemplateField HeaderText="剩余时间">

                    <EditItemTemplate>

                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

                    </EditItemTemplate>

                    <ItemTemplate>

                        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

                            <ContentTemplate>

                                <asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick">

                                </asp:Timer>

                                <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

                            </ContentTemplate>

                            <Triggers>

                                <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />

                            </Triggers>

                        </asp:UpdatePanel>

                        

                        <br />

                    </ItemTemplate>

                </asp:TemplateField>

            </Columns>

        </asp:GridView>

    </div>

    </form>

</body>

</html>

我将剩余时间那列转换为了模板。
asp.net gridview 显示倒计时

实现效果我就不展示了，不明白的地方可以讨论一下。
PS：我没有将剩余时间转换为你要的格式，偷一下懒啦。。。

引用 12 楼 insus 的回复:

refer here:
http://www.cnblogs.com/insus/p/4062619.html

要得就是这种效果，现在没时间弄，到时加分结贴

#14

JavaScript实现倒计时示例
//java代码
   <script type="text/javascript">
var msec=0
var sec=0
var min=0
function Time()
{
document.forms[0].time.value=min+":"+sec
go=setTimeout("Time()",1)
msec++
if(msec==1500)
{
msec=0
sec++
}
if(sec==59)
{
if(min<20)
{
sec=0
min++
}
}
}
</script>
//在body标签中加入事件处理
<body  onmousemove="Time()">
//刷新页面JS
public static void RefreshOpener()
{
  string js = @"<Script language='JavaScript'>
  opener.location.relocad();
  </Script>";
  HttpContext.Curent.Response.Write(js);
}

#1

up,希望lz有确实答案之后，公布一下。

#2

没人回复吗

#3

DateTime dt1 = DateTime.Parse("截止时间");
       DateTime dt2 = DateTime.Now;
        TimeSpan ts = new TimeSpan();
        ts = dt1 - dt2;

#4



 //将时间减去1秒，计算天、时、分、秒 

               function SetTime(time) {

                   if (time> 0) {

                       time= time- 1;

                   } else {

                       $("剩余时间控件id").html("已结束");

                   }

               }

原谅我的放荡不羁

#5

这里是数据计算，要看你怎样实时显示了：
http://www.cnblogs.com/insus/p/3979118.html

#6

引用 3 楼 z_dota 的回复:

DateTime dt1 = DateTime.Parse("截止时间");
       DateTime dt2 = DateTime.Now;
        TimeSpan ts = new TimeSpan();
        ts = dt1 - dt2;

引用 4 楼 xiaozhihui5535 的回复:



 //将时间减去1秒，计算天、时、分、秒 

               function SetTime(time) {

                   if (time> 0) {

                       time= time- 1;

                   } else {

                       $("剩余时间控件id").html("已结束");

                   }

               }

原谅我的放荡不羁

你们这是要坑我么？
我是要在页面上无刷新显示倒计时，不是问怎么倒计时

#7

用timer,js脚本更新?

#8

引用 5 楼 insus 的回复:

这里是数据计算，要看你怎样实时显示了：
http://www.cnblogs.com/insus/p/3979118.html

这是sql ，不是我想要的，我要在界面列表上无刷新显示倒计时，页面打开了，当前页面要实时显示剩余时间

#9

引用 7 楼 Z65443344 的回复:

用timer,js脚本更新?

单个lable更新好更新，就是列表上面，每条数据都要显示

#10

看了一下你的需求，写了一个Demo，可以实现无刷新，原理是使用asp.net scriptManger+UpdatePanel+Timer实现的。
后台：



using System;

using System.Collections;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;


namespace WebApplication

{

    public partial class WebForm2 : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            if (!this.IsPostBack)

            {

                List<Times> list = new List<Times>();

                list.Add(new Times { TestTime = DateTime.Now });

                list.Add(new Times { TestTime = DateTime.Now.AddHours(-4) });

                list.Add(new Times { TestTime = DateTime.Now.AddDays(-2) });

                gvList.DataSource = list;

                gvList.DataBind();

            }

        }


        protected void Timer1_Tick(object sender, EventArgs e)

        {

            for (int i = 0; i < gvList.Rows.Count; i++)

            {

                if (gvList.Rows[i].RowType == DataControlRowType.DataRow)

                {

                    Label l = (Label)gvList.Rows[i].FindControl("Label1");

                    l.Text = (DateTime.Now - Convert.ToDateTime(gvList.Rows[i].Cells[0].Text)).ToString();

                }

            }

        }

    }

}

前台：



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication.WebForm2" %>


<!DOCTYPE html>


<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <div>

         <asp:ScriptManager ID="ScriptManager1" runat="server">

                        </asp:ScriptManager>

        <asp:GridView ID="gvList" runat="server" AutoGenerateColumns="False">

            <Columns>

                <asp:BoundField DataField="TestTime" HeaderText="时间" />

                <asp:TemplateField HeaderText="剩余时间">

                    <EditItemTemplate>

                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

                    </EditItemTemplate>

                    <ItemTemplate>

                        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

                            <ContentTemplate>

                                <asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick">

                                </asp:Timer>

                                <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

                            </ContentTemplate>

                            <Triggers>

                                <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />

                            </Triggers>

                        </asp:UpdatePanel>

                        

                        <br />

                    </ItemTemplate>

                </asp:TemplateField>

            </Columns>

        </asp:GridView>

    </div>

    </form>

</body>

</html>

我将剩余时间那列转换为了模板。
asp.net gridview 显示倒计时

实现效果我就不展示了，不明白的地方可以讨论一下。
PS：我没有将剩余时间转换为你要的格式，偷一下懒啦。。。

#11

引用 8 楼 happy09li 的回复:

Quote: 引用 5 楼 insus 的回复:

这里是数据计算，要看你怎样实时显示了：
http://www.cnblogs.com/insus/p/3979118.html

这是sql ，不是我想要的，我要在界面列表上无刷新显示倒计时，页面打开了，当前页面要实时显示剩余时间

同下面的效果，有问题吗？Insus.NET只录制了十几秒：
asp.net gridview 显示倒计时

#12

refer here:
http://www.cnblogs.com/insus/p/4062619.html

#13

引用 10 楼 luanjun123456 的回复:

看了一下你的需求，写了一个Demo，可以实现无刷新，原理是使用asp.net scriptManger+UpdatePanel+Timer实现的。
后台：



using System;

using System.Collections;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;


namespace WebApplication

{

    public partial class WebForm2 : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            if (!this.IsPostBack)

            {

                List<Times> list = new List<Times>();

                list.Add(new Times { TestTime = DateTime.Now });

                list.Add(new Times { TestTime = DateTime.Now.AddHours(-4) });

                list.Add(new Times { TestTime = DateTime.Now.AddDays(-2) });

                gvList.DataSource = list;

                gvList.DataBind();

            }

        }


        protected void Timer1_Tick(object sender, EventArgs e)

        {

            for (int i = 0; i < gvList.Rows.Count; i++)

            {

                if (gvList.Rows[i].RowType == DataControlRowType.DataRow)

                {

                    Label l = (Label)gvList.Rows[i].FindControl("Label1");

                    l.Text = (DateTime.Now - Convert.ToDateTime(gvList.Rows[i].Cells[0].Text)).ToString();

                }

            }

        }

    }

}

前台：



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication.WebForm2" %>


<!DOCTYPE html>


<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <div>

         <asp:ScriptManager ID="ScriptManager1" runat="server">

                        </asp:ScriptManager>

        <asp:GridView ID="gvList" runat="server" AutoGenerateColumns="False">

            <Columns>

                <asp:BoundField DataField="TestTime" HeaderText="时间" />

                <asp:TemplateField HeaderText="剩余时间">

                    <EditItemTemplate>

                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

                    </EditItemTemplate>

                    <ItemTemplate>

                        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

                            <ContentTemplate>

                                <asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick">

                                </asp:Timer>

                                <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

                            </ContentTemplate>

                            <Triggers>

                                <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />

                            </Triggers>

                        </asp:UpdatePanel>

                        

                        <br />

                    </ItemTemplate>

                </asp:TemplateField>

            </Columns>

        </asp:GridView>

    </div>

    </form>

</body>

</html>

我将剩余时间那列转换为了模板。
asp.net gridview 显示倒计时

实现效果我就不展示了，不明白的地方可以讨论一下。
PS：我没有将剩余时间转换为你要的格式，偷一下懒啦。。。

引用 12 楼 insus 的回复:

refer here:
http://www.cnblogs.com/insus/p/4062619.html

要得就是这种效果，现在没时间弄，到时加分结贴

秒客网

asp.net gridview 显示倒计时

14 个解决方案

#1

#2

#3

#4

#5

#6

#7

#8

#9

#10

#11

#12

#13

#14

#1

#2

#3

#4

#5

#6

#7

#8

#9

#10

#11

#12

#13

#14

相关文章