Как использовать jQuery для хранения числовых входов в переменных и выполнения вычислений для повторного обновления ввода чисел?

0

Я делаю калькулятор BMI, используя HTML и jQuery.

<form id="bmicalc">
    <fieldset>
        <legend>BMI Calculator:</legend>
        <p>
            <label>Height:
                <input type="number" id="height1" min="3" max="7">ft
                <input type="number" id="height2" min="0" max="11">in</label>
        </p>
        <p>
            <label>Weight:
                <input type="number" id="weight" min="1" max="1400">lb</label>
        </p>
        <p>
            <label>BMI:
                <input id="bmi" type="number" min="1" max="200">
            </label>
        </p>
        <p>
            <input type="button" id="tehbaton" value="Check your BMI">
        </p>
    </fieldset>
</form>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10/jquery.min.js">
var height = $("#height1").val()*12 + $("#height2").val(); //Height in Inches
var weight = $("#weight").val();
$("#tehbaton").click(function(){
    $("#bmi").val(703*weight/(height^2));
});
</script>

Вот скрипка: http://jsfiddle.net/uzD9C/

Я изначально хотел, чтобы расчет выполнялся на клавиатуре, но решил, что я не знаю достаточно, чтобы это сделать. Поэтому я просто хочу обновить третье поле ввода, нажав кнопку отправки.

Но, как и сейчас, нажатие кнопки ничего не делает.

Уравнение для расчета ИМТ: BMI = (Вес в фунтах/(Высота в дюймах x Высота в дюймах)) x 703

  • 0
    может написать код внутри тега скрипта с установленным src . Закройте тег jquery.js , добавьте другой тег для своего кода
  • 0
    я думаю, что @charlietfl имел в виду, что вы НЕ МОЖЕТЕ иметь javascript внутри <script> , у которого установлен атрибут src . Также, если вы исправите это и переместите ваш вар в функцию щелчка, это должно сработать. проверить это обновление скрипки: jsfiddle.net/uzD9C/4
Показать ещё 1 комментарий
Теги:

1 ответ

3
Лучший ответ

Попробуй это:

$("#tehbaton").click(function () {
    if($("#height1").val() && $("#height2").val() && $("#weight").val()){
        var height = Number($("height1").val()) * 12 + Number($("height2").val());
        var weight = $("#weight").val();
        $("#bmi").val((703 * weight) / Math.pow(height,2));
    }
});

Вот скрипка

  • 0
    Большой! Оно работает. Не могли бы вы объяснить, что не так с моим кодом?
  • 0
    Во-первых, вы объявляете рост и вес вне клика. Таким образом, они всегда равны 0 и не зависят от значения выпадающего списка при изменении. Во-вторых, вы используете высоту ^ 2 вместо Math.pow (высота, 2).
Показать ещё 4 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню