Слушатель событий делает цикл только один раз - PullRequest
0 голосов
/ 16 октября 2019

E: Не знал, что назначение свойства number для поля ввода все равно будет передавать его как строковое спасибо за ответы!

Мой Eventlistener делает это так, что он проходит только через мой дляцикл один раз, затем останавливается.

Теперь я уверен, что решение простое, но я не могу найти проблему.

Работает нормально, если вы просто запустите функцию и введете значения вручную.

startButton.addEventListener("click",function(){
           floorFizz = document.getElementById("floor").value;
           capFizz = document.getElementById("cap").value;
           incrementFizz = document.getElementById("increment").value;
           FizzBuzz(floorFizz,capFizz,incrementFizz);
       });

function FizzBuzz(floor,cap,increment){
    for(let i=floor; i<cap; i+= increment){
        console.log("iteration")
        if(i%3 === 0 && i%5 === 0){
            console.log(i + "=FizzBuzz")
        }
        else if(i%3 === 0){
            console.log(i + "=Fizz")
        }
        else if(i%5 === 0){
            console.log(i + "=Buzz")
        }
        else{
            console.log(i)
        }
    }
}
<button id="startButton">Start</button>
<div id=floor>1</div>
<div id=cap>100</div>
<div id=increment>1</div>

Ни одно сообщение об ошибке не проходит через цикл только один раз.


let floorVal = document.createElement('input');
        floorVal.setAttribute('type','number');
        floorVal.id = "floor";
        floorVal.setAttribute('placeholder','Starting number')
        parent.appendChild(floorVal);


Ответы [ 2 ]

0 голосов
/ 16 октября 2019

Кажется, работает нормально, когда вы используете parseInt, чтобы убедиться, что вы получаете числа, а не строки:

document.getElementById('startButton').addEventListener("click",function(){
           floorFizz = parseInt(document.getElementById("floor").value);
           capFizz = parseInt(document.getElementById("cap").value);
           incrementFizz = parseInt(document.getElementById("increment").value);
           FizzBuzz(floorFizz,capFizz,incrementFizz);
       });
function FizzBuzz(floor,cap,increment){
    for(let i=floor; i<cap; i+= increment){
        console.log("ittaration")
        if(i%3 === 0 && i%5 === 0){
            console.log(i + "=FizzBuzz")
        }
        else if(i%3 === 0){
            console.log(i + "=Fizz")
        }
        else if(i%5 === 0){
            console.log(i + "=Buzz")
        }
        else{
            console.log(i)
        }
    }
}
Floor: <input type="number" id="floor" value="0" /><br/>
Cap: <input type="number" id="cap" value="100" /><br/>
Inc: <input type="number" id="increment" value="1"/><br/>

<button id="startButton">Start</button>
0 голосов
/ 16 октября 2019

преобразовать значения в числа ...

floorFizz = Number(document.getElementById("floor").value);
capFizz = Number(document.getElementById("cap").value);
incrementFizz = Number(document.getElementById("increment").value);
...