寻高手——倒计时循环倒计的问题

码小凯 2008-11-24 08:54:41

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="time.aspx.cs" Inherits="lianxi_time" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>

<script type="text/javascript">
var intervalID = 0;
var leftSeconds = 10;
var timeID='<%=Button1.ClientID%>';

function beginTimer()
{
loopTimerId = setInterval( timerStep, 1000 );
}
function timerStep()
{
if( leftSeconds > 1 )
{
leftSeconds --;
document.getElementById( "Button2").value = " "+leftSeconds.toString()+" ";
}
else
{
clearInterval( intervalID );
window.document.all(timeID).click();
}
}

</script>
</head>
<body >
<form id="form1" runat="server">
<div>

<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
<input id="Button2" type="button" value="开始" OnClick="beginTimer()" />

</div>
</form>
</body>
</html>

这是我设计的一个倒计时，按“开始”按钮后开始倒计从10秒递减到0时，触发Button1按钮的OnClick事件。
现在我想实现当倒计时从10倒计到0后重新倒计一共倒计十次，

下面我是对倒计时js代码部分做的修改
<script type="text/javascript">
var intervalID = 0;
var leftSeconds = 10;
var timeID='<%=Button1.ClientID%>';

function beginTimer()
{
for(var i=0;i<10;i++)
{
leftSeconds=10;
loopTimerId = setInterval( timerStep, 1000 );
}
}
function timerStep()
{
if( leftSeconds > 1 )
{
leftSeconds --;
document.getElementById( "Button2").value = " "+leftSeconds.toString()+" ";
}
else
{
clearInterval( intervalID );
window.document.all(timeID).click();
}
}

</script>
但这样实现不了循环倒计的。并且在第一次倒计结束时出现错误。
百思不的其解，望高手指点一二。

...全文

155 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

duping9626 2008-11-26

打赏
举报

下面可以实现你要的功能,但不是好的解决方案



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



<script runat="server">



    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            //初始是0(false)

            ViewState["postback"] = 0;

            //十次

            ViewState["count"] = 10;

        }

    }

    

    protected void Button1_Click(object sender, EventArgs e)

    {

        //服务器按钮点击后置1(ture)

        ViewState["postback"] = 1;



        ViewState["count"] = (int)ViewState["count"] - 1;

        if ((int)ViewState["count"] == 0)

            //十次完了置0

            ViewState["postback"] = 0;

    }



</script>



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

<head id="Head1" runat="server">

    <title>无标题页</title>

    <script type="text/javascript" language="javascript"> 

    var intervalID = 0; 

    var leftSeconds = 10; 

    var timeID='<%= Button1.ClientID%>';

   

    function beginTimer(flag) 

    { 

        //如果是点击开始或是Button1click就开始

        if(flag || <%= ViewState["postback"]%>)

            intervalID = setInterval( timerStep, 1000 ); 

    } 

    

    function timerStep() 

    { 

        if( leftSeconds > 1 ) 

        { 

            leftSeconds --; 

            document.getElementById( "Button2").value = "  "+leftSeconds.toString()+"  "; 

        } 

        else 

        { 

            clearInterval( intervalID ); 

            window.document.all(timeID).click();  

        } 

    } 

    

</script> 

</head>

<!--加载时就调beginTimer(false)-->

<body onload="beginTimer(false)">

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

    <div>

     <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click"   /> 

      <input id="Button2" type="button"  value="开始" OnClick="beginTimer(true)" /> 

    </div>

    </form>

</body>

</html>

码小凯 2008-11-25

打赏
举报

码小凯 2008-11-25

打赏
举报

非常谢谢您的帮忙。
不过您这个程序还是有问题，因为当执行完window.document.all(timeID).click(); 后相当于刷新了页面，而那个间隔倒计时也就失去了作用，必须重新点击开始按钮开始倒计时，而我需要的是只需点击开始按钮一次，然后每隔十秒触发Button按钮的OnClick事件，自动的不用再单击开始按钮了。

duping9626 2008-11-24

打赏
举报



<script type="text/javascript"> 

    var intervalID = 0; 

    var leftSeconds = 10; 

    var count =1;   //循环变量

    var timeID=' <%=Button1.ClientID%>'; 



    function beginTimer() 

    { 

        //你这里用循环十次不对的,一轮没完新的一轮又开如leftSeconds=10;

        /*for(var i=0;i <10;i++) 

        { 

          leftSeconds=10; 

          loopTimerId = setInterval( timerStep, 1000 ); 

        } */



        loopTimerId = setInterval( timerStep, 1000 ); 

        count =count+1;

    } 

    function timerStep() 

    { 

        if( leftSeconds > 1 ) 

        { 

            leftSeconds --; 

            document.getElementById( "Button2").value = "  "+leftSeconds.toString()+"  "; 

        } 

        else 

        { 

            clearInterval( loopTimerId ); 

            window.document.all(timeID).click();  

            //一轮过后重新再计

            leftSeconds =10;

            if(count<10)

            {

              beginTimer();

            }

            

        } 

    } 

</script>

止戈而立 2008-11-24

打赏
举报

倒计时100秒，分10次。。

surewy 2008-11-24

打赏
举报

帮顶

magicbacon 2008-11-24

打赏
举报

给出一个替代的方法~

magicbacon 2008-11-24

打赏
举报

<%@ Page Language="C#" %>



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



<script runat="server">



    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {



        }

    }



    protected void Button1_Click(object sender, EventArgs e)

    {

        this.Button1.Text = "OK";

    }

</script>



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

<head runat="server">

    <title></title>



    <script type="text/javascript"> 

    

    var intervalID = 0; 

    var leftSeconds = 100; 

    var timeID='<%=Button1.ClientID%>';



    function beginTimer() 

    { 

        loopTimerId = setInterval(timerStep, 1000); 

    } 



    function timerStep() 

    { 

        if( leftSeconds > 1 ) 

        { 

            leftSeconds--; 

            var seconds = leftSeconds % 10;

            document.getElementById("Button2").value = "  " + seconds.toString() + "  "; 

        } 

        else 

        { 

            clearInterval(intervalID); 

            window.document.all(timeID).click();  

        } 

    }



</script>



</head>

<body>

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

        <div>

            <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />

            <input id="Button2" type="button" value="开始" onclick="beginTimer()" />

        </div>

    </form>

</body>

</html>