1

我有一个页面，有一个定时测试。我正在使用 FlipClockJS 作为计时器，并且我有一个文本框，用户可以在其中输入他们选择的时间。输入框（.set）代码如下所示：

  $(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);

   }
  });

当我调用此脚本时，警报为我提供了我想要的正确值，但是由于某种原因它会返回并重新运行 document.ready（我知道这一点，因为我在 document.ready 之后放置了警报以查看它何时触发）因此消除我所有的辛勤工作。

我不知道为什么会这样。Document.ready 仅在页面上运行此脚本时才会被调用。

这是完整的页面

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

1 回答 1

0

取消按回车的默认动作

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

或者，如果您实际上并没有使用表单，那么请摆脱表单并提交按钮。

于 2018-01-29T22:20:19.107 回答