的setInterval和clearInterval发出

我有这个麻烦，我的代码（简化）：的setInterval和clearInterval发出

$(document).ready(function() { 

    var theta = 0; 

    carouselNext = function() { 
    theta += 1; 
    } 

    var carouselInterval = window.setInterval(carouselNext, 1000); 
    var spinning = true; 

    $("#stopstart").click.function() { 
    if (spinning) { 
     clearInterval(carouselInterval); 
     spinning = false; 
    } else { 
     carouselInterval = setInterval(carouselNext, CAROUSEL_DURATION); 
     spinning = true; 
    } 
    }

编辑：这里是我的代码的完整版

var CAROUSEL_DURATION = 5000; 
    var html = ''; 
    $(document).ready(function(){ 
     $.getJSON("/static/js/users.json", function(data){ 
      $.each(data, function(index, student){ 
       html += '<div class="student">'; 

       html += '<h2>' + student.level + ' of the Month</h2>'; 

       html += '<h4>' + student.firstname + ' ' + student.lastname + '</h4>'; 

       html += '<p>' + student.class + '</p></br>'; 

       html += '</div>'; 
      }); 
      $('.students').html(html); 

      $('.students').cycle({ 
       fx: 'fade', 
       pause: '1', 
       prev: '#prev', 
       next: '#next', 
       speed: '500', 
       timeout: 10000 
      }); 
     // catch JSON reading error 
     }).fail(function(d, textStatus, error) { 
      console.error("getJSON failed, status: " + textStatus + ", error: "+error) 
     }); 
     $(".my-btn").click(function() { 
      $('<li>').text("click").prependTo('.posts'); 

     }); 

     var carousel = document.getElementById('carousel'); 
     var navButtons = document.querySelectorAll('#navigation button'); 
     var panelCount = carousel.children.length; 
     var transformProp = Modernizr.prefixed('transform'); 
     var theta = 0; 

     $("#next").on('click', function() { 
      theta += (360/panelCount) * -1; 
      carousel.style[ transformProp ] = 'translateZ(-288px) rotateY(' + theta + 'deg)'; 
     }); 


     carouselNext = function() { 
      theta += (360/panelCount) * -1; 
      carousel.style[ transformProp ] = 'translateZ(-288px) rotateY(' + theta + 'deg)'; 
     } 

     var carouselInterval = window.setInterval(carouselNext, CAROUSEL_DURATION); 
     var spinning = true; 

     // stop carousel spinning 
     $("#stop-start").click(function() { 
      if (spinning) { 
       clearInterval(carouselInterval); 
       spinning = false; 
      } else { 
       carouselInterval = setInterval(carouselNext, CAROUSEL_DURATION); 
       spinning = true; 
      } 
     }) 

     // clicking on carousel navigation buttons 
     onNavButtonClick = function(event) { 
      var increment = parseInt(event.target.getAttribute('data-increment')); 
      theta += (360/panelCount) * increment * -1; 
      carousel.style[ transformProp ] = 'translateZ(-288px) rotateY(' + theta + 'deg)'; 
     }; 

     for (var i=0; i < 2; i++) { 
      navButtons[i].addEventListener('click', onNavButtonClick, false); 
     } 

    });

当我加载正如预料的那样，theta正在每秒钟滴答1次，如预期的那样...

当我点击“stopstart”按钮时，theta停止响起，如预期的那样...

但是，当我再次单击“stopstart”时，theta会返回NaN。我不明白为什么会这样。任何想法，我要去错了吗？

来源

2015-05-12 user2260199

什么是$（“＃stopstart”）。click.function'？它应该是'$（“stopstart”）。click（function' – Barmar

你已经简化了你的代码太多了。你能发布足够的代码，以便它能够真正执行并演示这个问题吗？ – Barmar

它适用于我。可能与关闭有关，请示出一个不太简单的例子 –

感谢@gillesc他们有帮助的注释 - ＃停止斯托特在里面#navigation造成onNavButtonClick在同一时间carouselNext被解雇，造成

increment = parseInt(event.target.getAttribute('data-increment'));

失败，转向THETA成为NaN的。

来源

2015-05-12 03:46:48 user2260199

的setInterval和clearInterval发出

回答

相关问题