简体   繁体   中英

$(document).ready being called twice

I have a page, with a timed test. I'm using FlipClockJS for the timer, and I have a text box where the user can input a time of their choosing. The input box(.set) code looks like :

  $(this).keypress(function(event) {
  if (event.which == 13) {
    var setme = $('.set').val();
    set2 = parseFloat(setme); //this is inefficient
    alert(set2);
    $('.set').val(set2); 
    clock.setValue(set2);

   }
  });

When I call this script, the alert gives me the right value I want, however it goes back and re-runs document.ready for some reason (I know this as I put an alert after document.ready to see when it fires) thus undoing all my hard work.

I don't know why this is happening. Document.ready only gets recalled when this script is run on the page.


Here's the full page

var clock;
var set2 = 60;
var slideNum = 1;
var ansPress;

$(document).ready(function() {
  alert('pageload');
  // Instantiate a counter
  clock = new FlipClock($('.clock'), set2, {

    clockFace: 'Counter',
    countdown: true,
    autoStart: false

  });

  var timer = new FlipClock.Timer(clock, {
    callbacks: {
      interval: function() {                
        var time = this.factory.getTime().time;
        if (time == 0 && slideNum != 11) { //when we finish the countdown
          clock.setValue(set2); //set the clock to the number in the text box
          $('.carousel').carousel('next'); //move to the next slide
          slideNum ++;
        }
        else if (slideNum == 11 ) { 
          timer.stop();
        }
        else {
          clock.decrement(); //move the clockdown 1 if not at 0
        }
      }

    }
  });

  $(this).keypress(function(event) {
  if (event.which == 13) {
    var setme = $('.set').val();
    set2 = parseFloat(setme); //this is inefficient
    alert(set2);


   }
  });

  // Attach a click event to a button a increment the clock
  $('.increment').click(function() {
    clock.increment();
    set2++;
    $('.set').val(set2); 
  });

  // Attach a click event to a button a decrement the clock
  $('.decrement').click(function() {
    clock.decrement();
    set2--;
    $('.set').val(set2); 
  });

  //if you click answers, go to the answers page 
  $('.answers').click(function() {
  $('.carousel').carousel(12);
  ansPress = 1;
  });

  //start the timer 
  $('.start').click(function() {

  timer.start();
  //move to the next slide if it's the first time you've pressed it
  if (slideNum == 1 ) {
    $('.carousel').carousel('next');
  }  
  //toggle buttons
  $( '.start' ).prop( "disabled", true );
  $( '.pause' ).prop( "disabled", false );
  });

  //pause
  $('.pause').click(function() {
    timer.stop();
  //toggle buttons
  $( '.start' ).prop( "disabled", false );
  $( '.pause' ).prop( "disabled", true );
  });
});

cancel the default action of hitting enter

$(this).keypress(function(event) {
  if (event.which == 13) {
    event.preventDefault();
  }
}

or if you are not actually using forms, than get rid of the form and submit button.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM