How to add 5 minute javascript countdown timer which submit a form

后端 未结 5 435
深忆病人
深忆病人 2021-01-03 12:27

I want to add 5 minute countdown timer which submit a form to my php page.

        
相关标签:
5条回答
  • 2021-01-03 12:37

    /*timer*/
    
          var seconds = 300;
          function secondPassed() {
              var minutes = Math.round((seconds - 30)/60),
                  remainingSeconds = seconds % 60;
    
              if (remainingSeconds < 10) {
                  remainingSeconds = "0" + remainingSeconds;
              }
    
              document.getElementById('countdown').innerHTML = minutes + ":" + remainingSeconds;
              if (seconds == 0) {
                  clearInterval(countdownTimer);
                 //form1 is your form name
                document.form1.submit();
              } else {
                  seconds--;
              }
          }
          var countdownTimer = setInterval('secondPassed()', 1000);
    .timer {
        width: 100px;
        font-size: 2.5em;
        text-align: center;
    }
    <div class="timer">
                <time id="countdown">5:00</time>
            </div>
    <form action="index.php" name="form1" id="form1">

    0 讨论(0)
  • 2021-01-03 12:43

    Hope this helps

    var trig = setInterval(timer,1000);
    
        var counter=0;
        var min=4;
        var sec=60;
    
        function timer(){
    
        sec=--sec;
    
        if(sec===0){
        min=--min;
        sec=59;
        counter=++counter;
        }
    
        if(counter===5){
        sec=0;
        min=0;
        clearInterval(trig);
         functionSubmit();
         document.write("Submitted");
         }
    
         document.getElementById("output").innerHTML = min+" : "+sec;
    
         }
    <p>Autosubmit in <span id="output"></span></p>

    0 讨论(0)
  • 2021-01-03 12:46

    Here is what you want, I used a while ago - https://jsfiddle.net/v5uc9wfx/3/

    function CountDown(duration, display) {
        if (!isNaN(duration)) {
            var timer = duration, minutes, seconds;
    
            var interVal = setInterval(function () {
                minutes = parseInt(timer / 60, 10);
                seconds = parseInt(timer % 60, 10);
    
                minutes = minutes < 10 ? "0" + minutes : minutes;
                seconds = seconds < 10 ? "0" + seconds : seconds;
    
                $(display).html("<b>" + minutes + "m : " + seconds + "s" + "</b>");
                if (--timer < 0) {
                    timer = duration;
                    SubmitFunction();
                    $(display).empty();
                    clearInterval(interVal)
                }
            }, 1000);
        }
    }
    

    Here -

    CountDown(duration, display) 
    

    Duration is passed in seconds, i.e. 300 second= 5 Minutes. display is another parameter you want to display where.

    You might need to clear interval as well-

    clearInterval(interVal)
    

    With form

            function CountDown(duration, display) {
                if (!isNaN(duration)) {
                    var timer = duration, minutes, seconds;
                    
                  var interVal=  setInterval(function () {
                        minutes = parseInt(timer / 60, 10);
                        seconds = parseInt(timer % 60, 10);
    
                        minutes = minutes < 10 ? "0" + minutes : minutes;
                        seconds = seconds < 10 ? "0" + seconds : seconds;
    
                        $(display).html("<b>" + minutes + "m : " + seconds + "s" + "</b>");
                        if (--timer < 0) {
                            timer = duration;
                           SubmitFunction();
                           $('#display').empty();
                           clearInterval(interVal)
                        }
                        },1000);
                }
            }
            
            function SubmitFunction(){
           $('form').submit();
            
            }
        
             CountDown(300,$('#display'));
          
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <div id="display">
    
    </div>
    <form action="/" >
    <lable>Name: <input type="text"></lable>
    
    </form>

    0 讨论(0)
  • 2021-01-03 12:50

    setTimeout() will fire a function SubmitForm after 300000 milliseconds = 5 minutes.

    function SubmitForm(){
        $("form").submit();
    };
    setTimeout(SubmitForm,300000);//5*60*1000
    
    0 讨论(0)
  • 2021-01-03 12:55

    you can use Window setTimeout() Method to call submit form after 5 minutes

    setTimeout(function submitform()
    {
      document.myform.submit();
    }, 60*1000*5);
    
    0 讨论(0)
提交回复
热议问题