2016-04-09 15 views
0

Herkese bir zamanlayıcı yapıyorum ve bir sorunum var. i anahtarıBir anahtar ve jquery kullanarak SELECT FORM DEĞERİ DEĞİŞTİRME

ile sonunda kesinlikle

bu benim kodudur lütfen birisi yanılıyorum nerede açıklayabilir hızlandırmak için çalışıyor ve zamanlayıcı aşağı seçkin formu kullanarak ancak bu işe yaramazsa ediyorum :

html:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<title>Title</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> 
</head> 
<body> 

`: :

<input id="reset" type="button" value="reset"> 
<input id="pauseButton" type="button" value="Pause"> 
<input id="reprendreButton" type="button" value="Reprendre"> 

<form> 
<select id="bla" > 
<option value="x05">x05</option> 
<option value="x1" selected>x1</option> 
<option value="x2">x2</option> 
<option value="x4">x4</option> 
</select> 
</form> 

`

belge hazır olduğunda yalnızca #bla değerini kontrol ediyoruz

<script> 





var timer = { 
    totalSeconds: 0, 
    start: function() { 
     var mat = this; 

     this.interval = setInterval(function() { 
      mat.totalSeconds += 1; 

      $("#heure").text(Math.floor(mat.totalSeconds/3600)); 
      $("#min").text(Math.floor(mat.totalSeconds/60 % 60)); 
      $("#sec").text(parseInt(mat.totalSeconds % 60)); 
     }, 1000); 
    }, 





    pause: function() { 

     this.interval = clearInterval(this.interval); 
     this.interval = delete this.interval; 

    }, 

    x05: function() { 

     // this.interval = this.totalSeconds += 2; 
     var mat = this; 

     this.interval = setInterval(function() { 
      mat.totalSeconds += 1/2; 

      $("#heure").text(Math.floor(mat.totalSeconds/3600)); 
      $("#min").text(Math.floor(mat.totalSeconds/60 % 60)); 
      $("#sec").text(parseInt(mat.totalSeconds % 60)); 
     }, 1000); 


    }, 

    x1: function() { 

     // this.interval = this.totalSeconds += 2; 
     var mat = this; 

     this.interval = setInterval(function() { 
      mat.totalSeconds += 1; 

      $("#heure").text(Math.floor(mat.totalSeconds/3600)); 
      $("#min").text(Math.floor(mat.totalSeconds/60 % 60)); 
      $("#sec").text(parseInt(mat.totalSeconds % 60)); 
     }, 1000); 


    }, 

    x2: function() { 

     // this.interval = this.totalSeconds += 2; 
     var mat = this; 

     this.interval = setInterval(function() { 
      mat.totalSeconds += 2; 

      $("#heure").text(Math.floor(mat.totalSeconds/3600)); 
      $("#min").text(Math.floor(mat.totalSeconds/60 % 60)); 
      $("#sec").text(parseInt(mat.totalSeconds % 60)); 
     }, 1000); 


    }, 

    x4: function() { 

     // this.interval = this.totalSeconds += 2; 
     var mat = this; 

     this.interval = setInterval(function() { 
      mat.totalSeconds += 4; 

      $("#heure").text(Math.floor(mat.totalSeconds/3600)); 
      $("#min").text(Math.floor(mat.totalSeconds/60 % 60)); 
      $("#sec").text(parseInt(mat.totalSeconds % 60)); 
     }, 1000); 


    }, 

    Reprendre: function() { 

     this.interval = !this.interval; 
     this.interval = this.start(); 
    }, 

    reset: function() { 

     // clearInterval(this.interval); 

     this.interval = this.totalSeconds -= this.totalSeconds +=1 ; 


    } 

}; 

timer.start(); 


$('#pauseButton').click(function() { timer.pause(); }); 
$('#reprendreButton').click(function() { timer.Reprendre(); }); 
$('#reset').click(function() { timer.reset(); }); 


$(document).ready(function(){ 
    switch($('#bla').val()) { 

     case 'x05': 
      /* $('#bla').click(function() { timer.x05(); }); */ 
      break; 
     case 'x1': 
      /* $('#bla').click(function() { timer.x1(); }); */ 
      break; 
     case 'x2': 
      /* $('#bla').click(function() { timer.x2(); }); */ 
      break; 
     case 'x4': 
      /* $('#bla').click(function() { timer.x4(); }); */ 
      break; 
     default: 
     // 
    } 
}); 

cevap

0

javascript. Yapmanız gereken: Eğer #bla zaman seçme kutusu değişikliklerin değerini işaretleyerek olacağını

İşte
$(document).ready(function(){ 
    $('#bla').on('change', function(){ 
    switch($(this.val())) { 
     case 'x05': 
      timer.x05(); 
      break; 
     case 'x1': 
      timer.x1(); 
      break; 
     case 'x2': 
      timer.x2(); 
      break; 
     case 'x4': 
      timer.x4(); 
      break; 
     default: 
      // 
      break; 
     } 
    }); 
}); 

. Sonra onları uncommented sonra işlevlerini koşarak. Geri kalan kodun çalışıp çalışmadığından emin değilim, ancak seçimdeki değer değiştiğinde bu anahtarın çalışması gerekir. Bunu

https://codepen.io/dammeul/pen/GZQpqZ?editors=1010

Şu zaman çalışır ve bu tür ve ancak:

Bir CodePen yaptık, bu beni çıkabilirimama ne işe daha kolay oldu bu yüzden JS yazmak nasıl sadece bir kez durur, aralığa yeniden başladıktan sonra duraklamak istemiyor gibi görünmektedir. İyi bir şekilde sıfırlansa ve hız kontrollerinden emin değilim. Bir göz atın, umarım bu sizin için tam bir düzeltme yapmanıza yardımcı olur.

+0

Cevabınız için teşekkürler, ancak hala işe yaramıyor. – mathieu

+0

Üzgünüm, bunu cevapladığım zaman geç oldu! Bazı düzenlemeler yaptım, temelde yaptığınız her şey değiştiğinde anahtarı çalıştırıyordu ve daha sonra '# bla''yı tıkladığınızda işlevi çalıştıracak olan tıklama etkinliğini başlatıyordu. Yapmanız gereken şey, # bla’nın her değiştiğinde işlevi çalıştırmaktır. Zamanlayıcı fonksiyonunuz doğru çalışıyorsa ve '.x05' vb. Isabet ediyorsanız, bunun işe yarayacağını düşünüyorum! – Adam

+0

Bazı düzenlemeler yaptım ve kod çalışmanızın çoğunu incelemeniz için bir kod kalemi ekledim, ancak JS'mi nasıl yazdığımı yazıyor ancak kodunuzu açık olarak kullanıyorsunuz! Bazı bitler işe yaramıyor, ama umarım ki başlamana yetecek kadar düzelttim. – Adam

İlgili konular