jQuery кнопки для приложения FizzBuzz

Question

Я работаю над очень простым приложением JavaScript FizzBuzz с использованием Rails, но я не могу получить форму и ее кнопки. Я знаю, что это очень грубый код, а некоторые из них в HTML и JavaScript в отличие от Ruby, потому что я больше знаком с бывшими двумя, чем с последними.

Вот моя форма:

<p>In this field, put the starting number. It must be a positive integer <50.</p> 
<form name="FizzBuzz Form"> 
<input type="text" name="fizzBuzzStart"/> 
</form> 
<div class="button" id="start">Add!</div><br> 
<p>In this field, put the ending number. It must be a positive integer >50.</p> 
<form name="FizzBuzz Form"> 
<input type="text" name="fizzBuzzEnd"/> 
</form> 
<div class="button" id="end">Add!</div><br><br> 
<div class="button" id="play">Let's play!</div><br> 

Это мой script.js файл:

$("#start").click(function(){ 
    var start = $("input[name=fizzBuzzStart]").val();}); 
$("#end").click(function(){ 
    var end = $("input[name=fizzBuzzStart]").val();}); 
$("#play").click(function(){ 
    for (var i=start; i<=end; i++) { 
     if (i%15===0){console.log("FizzBuzz");} 
      else if (i%3===0){console.log("Fizz");} 
      else if (i%5===0){console.log("Buzz");} 
      else {console.log(i);} }});}); 

Любой совет будет весьма признателен!

Answer 1

Основная проблема заключается в том, что start и end используются в качестве локальных переменных, поэтому они эффективно удаляются, как только они установлены. Сделайте их глобальными и исправьте имя поля в обработчике кликов #end.

var start, end; 

$("#start").click(function() { 
    start = $("input[name=fizzBuzzStart]").val(); 
}); 

$("#end").click(function() { 
    end = $("input[name=fizzBuzzEnd]").val(); 
}); 

$("#play").click(function() { 
    for (var i = start; i <= end; i++) { 
     if (i % 15 === 0) { 
      console.log("FizzBuzz"); 
     } else if (i % 3 === 0) { 
      console.log("Fizz"); 
     } else if (i % 5 === 0) { 
      console.log("Buzz"); 
     } else { 
      console.log(i); 
     } 
    } 
}); 

Демо: http://jsfiddle.net/fJyRb/