Ввод HTML как переменной JavaScript

#javascript #html #variables

#javascript #HTML #переменные

Вопрос:

Я надеюсь, что это не доставит особых хлопот. Я работаю над проектом, чтобы попрактиковаться в моем HTML и JavaScript. У меня есть текстовое поле, которое принимает числа, и я хочу, чтобы кнопка принимала это число и выполняла с ним некоторые вычисления. Однако, я не могу понять, как превратить ввод HTML в переменную, которую будет принимать JavaScript. Вот мой HTML:

 <!doctype html>
<!-- project10.html -->

<html>
    <head>
        Hello! <br>
        This generator takes an odd number and prints out all odd numbers below it down to 0. <br>
        Enter the number you want to calculate, between 1 and 10, and then click the text below. <br>
    </head>
    <body>
    Enter your number: <input type="number" id="numberBox" size=12 value="9">
        <title>Testing Function</title>
        <script type="text/javascript" src="test.js"></script>
        <p id="demo" onclick="myFunction(9)">Click this to show numbers.</p>
    </body>
</html>

Вот test.js файл, расположенный в той же папке:

 function myFunction(b2){
    b1 = b2 % 2;
    b2 = b2 - 1   b1;
    if (b2 < 1) {
        document.getElementById("demo").innerHTML = "Number too low!";
    } 
    else if (b2 > 10) {
        document.getElementById("demo").innerHTML = "Number too high!";
    } 
    else {
        document.getElementById("demo").innerHTML ="";
        for (i=b2;i>0;i--){
            document.getElementById("demo").innerHTML  = i  '<br>';
            i--;
        }
    }
}

Это будет последняя помощь, которая мне понадобится на некоторое время. Я, вероятно, просто что-то упускаю из виду, и это горит.

Ответ №1:

 <!doctype html>
<!-- project10.html -->

<html>
    <head>
        Hello! <br>
        This generator takes an odd number and prints out all odd numbers below it down to 0. <br>
        Enter the number you want to calculate, between 1 and 10, and then click the text below. <br>
    </head>
    <body>
    Enter your number: <input type="number" id="numberBox" size=12 value="9">
        <title>Testing Function</title>
        <script type="text/javascript" src="test.js"></script>
        <button id="demo" onclick="myFunction()">Click this to show numbers.</button>
    </body>
</html>

<script>
function myFunction() {
    let input = document.getElementById("numberBox").value;
    console.log(input);
}
<script>

Ответ №2:

Вы передали значение функции во время вызова, вы должны были получить значение в функции

Попробуйте это в вашем HTML-файле <p id="demo" onclick="myFunction()">Click this to show numbers.</p>

Обратите внимание, что я удалил 9 в myFunction()