$(document).ready being called twice

Question

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 );
  });
});

try `$(this).keypress(function(event)` => `$(document).keypress(function(event)` — viz, Jan 29 '18 at 22:07
And I see you are misusing a lot of `this`... Head up to https://stackoverflow.com/questions/3127429/how-does-the-this-keyword-work — viz, Jan 29 '18 at 22:09
Yeah, I don't really know what I'm doing. I tried your document substitution and didn't work. Neither does going back to basics ie $('.set').keypress(function(e) { if (e.which == 13) { var setme = $('.set').val(); set2 = parseFloat(setme); //this is inefficient alert(set2); } }); Annoyingly I DID have this working at some point previously but I broke it and can't see how or when or where — Richard Tock, Jan 29 '18 at 22:15
Well hitting enter could cause a form to resubmit which causes the page to reload. So cancel the default action of enter — epascarello, Jan 29 '18 at 22:17
Use [preventDefault](https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault) — Matt Burland, Jan 29 '18 at 22:19

score 0 · Accepted Answer · answered Jan 29 '18 at 22:20

0

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.

answered Jan 29 '18 at 22:20

epascarello

204,599
20
195
236

$(document).ready being called twice

1 Answers1