Как оценить реципрокную функцию

Question

Я строю базовый калькулятор JQuery. Все шло хорошо, пока я не попытался выполнить ответную функцию. У меня это связано с событием клика. Код выглядит так

// inverse is $(".row li.inverse")
inverse.on("click", function () {
    // textBox is $("input#result")
    var val = textBox.val(),
        text = parseFloat(val),
        recip = eval(1/text);
    textBox.val(recip);
});

Так что по нажатию кнопки с классом inverse, он должен получить значение того, что находится в inputи превратить его в число. Должно тогда eval число как 1, деленное на число, и установите значение текстового поля равным ответу. Но когда я нажимаю кнопку, значение остается прежним. Однако когда я помещаю код в firebug без обработчика щелчков, он работает просто отлично. Куда я иду не так?

скрипка

Answer 1

У вас есть 22 ключа и в key.each цикл Вы связываете обработчики снова и снова, поэтому он выполняется 22 раза. Это означает, что каждый из ваших ключей имеет одно и то же событие, зарегистрированное 22 раза. Так что рассмотрите взаимную ситуацию, которая у вас есть. Вы берете значение из текстового поля и конвертируете его в обратное значение, так что это один раз, и у вас все хорошо. Но это происходит 22 раза, поэтому четное число взаимных операций с одним и тем же значением само возвращает одно и то же значение. Также вам не нужно использовать eval, Просто сделайте правильную операцию. Также помните, что JavaScript выполняет арифметические операции с плавающей запятой.

  key.each(function () {


        if (!$(this).is(functions)) {
            $(this).on("click", function () {
                var number = $(this).text();
                // Inserts value of clicked button into the input
                textBox.val(textBox.val() + number);
            });
        }
    }); //<-- end it here

    var clear = $(".row li.clear"),
        backspace = $(".row li.back"),
        equals = $(".row li.equals"),
        inverse = $(".row li.inverse");
    clear.on("click", function () {
        // Clears the input value if the clear button is clicked
        textBox.val('');
    });
    backspace.on("click", function () {
        // Removes last character of input
    });
    equals.on("click", function () {
        $("#function").text(textBox.val());
        // Evaluates what is in the input
        setTimeout(function () {
            // Sets that to the value
            textBox.val(eval(textBox.val()));
        }, 1);
    });

    inverse.on("click", function () {
        var val = textBox.val(),
            text = parseFloat(val),
            recip = eval(1 / text);
        textBox.val(recip);
    });