Блог

Главная - Вопросы по программированию - Как настроить программу Javascript на ожидание

Как настроить программу Javascript на ожидание

#javascript #html #timer #settimeout

#javascript #HTML #таймер #settimeout

Вопрос:

Мой код выглядит следующим образом:

 <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Demo</title>  
 <style type="text/css">
    #submitbox .button{
        padding:3px 6px;
        background:#B4D666;
        border-top:1px solid #B4D666;
        border-right:1px solid #81B840;
        border-bottom:1px solid #81B840;
        border-left:1px solid #B4D666;
        color:#2970A6;
        font-size:11px;
        cursor:pointer;
    }

    #submitbox .disabled-button{
        background: #CCCCCC;
        border-color: #CCCCCC #999999;
        color: #CC6600;
    }    
</style>
</head>
<body>
    <form name="form1" method="post" action="#">

        <input name="counter" id="counter" value="enable" type="text" /> <br/><br/>
        <div id="submitbox">     
            <input id="cmt-submit" type="button" class="button" value="Submit comment" onclick="return timer();" />
        </div>

        <script type="text/javascript">
            <!-- 
            // 
            var cmtSubmit = document.getElementById('cmt-submit');
            var count = document.getElementById('counter');
            var milisec = 0;
            var seconds = 10;
            var timercmt = 0;
            var timertxt = 0;
            function display() {
                if (milisec <= 0) {
                    milisec = 9;
                    seconds -= 1;
                }
                if (seconds <= -1) {
                    milisec = 0;
                    seconds  = 1;
                }
                if (seconds == 0) {
                    cmtSubmit.value = "Submit comment";
                    cmtSubmit.disabled=false;
                    cmtSubmit.className = "button";                  
                    clearTimeout(timercmt);                           
                }
                else {
                    milisec -= 1;
                    cmtSubmit.value = seconds   " sec wait before next comment";
                    cmtSubmit.disabled = true;
                    cmtSubmit.className = "disabled-button";                     
                    timercmt = setTimeout("display()", 100);
                }
            }

            function timer() {      
                if (count.value == "enable") { 
                    count.value = "disable";
                    timertxt = setTimeout("setCounter()", 10000);
                    return true;                              
                } 
                else      
                {        
                    clearTimeout(timertxt);   
                    display();    
                    count.value == "enable"           
                    return false; 
                }
            }  

            function setCounter() {
                count.value == "enable"    
            }  
            --> 
        </script>
    </form>
</body>
</html>

Это работает только при первом запуске hix hix.

Кто-нибудь может увидеть, где я ошибаюсь?

Комментарии:

1. добавьте к вашему вопросу еще несколько тегов, таких как «javascript», «html». Тогда вы скорее получите хороший ответ.

2. setTimeout может работать как со ссылкой на функцию, так и путем вычисления кода. В вашем случае намного лучше использовать ссылку. Короче говоря, замените setTimeout("display()", 100); на setTimeout(display, 100); .

3. Мой вопрос в том, когда пользователь, отправляющий комментарий, будет иметь период ожидания в 10 секунд, и время будет рассчитано после отправки комментария пользователем.

Ответ №1:

Нашел это: Вы забыли повторно инициализировать переменную. Обновленный код выглядит следующим образом:

     <script type="text/javascript">
        <!-- 
        // 
        var cmtSubmit = document.getElementById('cmt-submit');
        var count = document.getElementById('counter');
        var milisec = 0;
        var seconds = 10;
        var timercmt = 0;
        var timertxt = 0;
        function display() {
            if (milisec <= 0) {
                milisec = 9;
                seconds -= 1;
            }
            if (seconds <= -1) {
                milisec = 0;
                seconds  = 1;
            }
            if (seconds == 0) {
                cmtSubmit.value = "Submit comment";
                cmtSubmit.disabled = false;
                cmtSubmit.className = "button";                  
                clearTimeout(timercmt);   
                //--- You have to re--initialize variables here
                 milisec = 0;
                 seconds = 10;
                 timercmt = 0;
                 timertxt = 0;                        
            }
            else {
                milisec -= 1;
                cmtSubmit.value = seconds   " sec wait before next comment";
                cmtSubmit.disabled = true;
                cmtSubmit.className = "disabled-button";                     
                timercmt = setTimeout("display()", 100);
            }
        }

        function timer() {      
            if (count.value == "enable") { 
                count.value = "disable";
                timertxt = setTimeout("setCounter()", 10000);
                return true;                              
            } 
            else      
            {        
                clearTimeout(timertxt);   
                display();    
                count.value == "enable"           
                return false; 
            }
        }  

        function setCounter() {
            count.value == "enable"    
        }  
        --> 
    </script>