的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發出

回答

相關問題