试图使货币转换器使用jQuery工作 [英] Trying to get currency converter to work using jQuery

问题描述

我正在使用jQuery制作货币转换器的项目.我从api服务获取货币信息，并将其加载到具有多种货币的表中.之后，我希望能够在一个输入中输入一个数字，并使其他输入根据输入的输入生成正确的货币.

I'm working on a project using jQuery to make a currency converter. I'm getting the currency info from an api service and loading it up in a table with multiple currencies. After which, I want to be able to enter a number in one input and make the other inputs produce the correct currency according to the entered input.

您可以在下面的代码中看到，我正在尝试使keyup函数对除当时正在输入数字的输入之外的所有内容起作用. 我的函数输出结果也不正确.

As you can see in the following code, I'm trying to make the keyup function work on everything but the input of which the numbers are being entered at that moment. My output result from the function is also incorrect.

如果有人可以指出我在这里犯的一个非常明显的错误，那将非常有帮助！

If anyone can point out the very obvious mistake I'm making here that would be very helpful!

JS:

function parseCurrency(data) {
var container = $('.currency-data');

var iskInput = $('<tr>' +'<td>' + '<strong>ISK</strong>' + 
    '</td> ' + '<td>' + 'Íslensk króna' + 
    '</td>' + '<td></td>' + '<td>' + '1' + '</td>' + 
    '<td>' + '<input value="1000" class="input-value"></input>' + '</td>' + 
    '</tr>'); 
iskInput.prependTo(container);

$.each(data.results, function (key, currency){
    var row = [];
    row = $('<tr></tr>');
    row.append('<td>' + '<strong>' + currency.shortName + '</strong>' + '</td>');
    row.append('<td>' + currency.longName + '</td>');
    row.append('<td>' + currency.changeCur + '</td>');
    row.append('<td>' + currency.value + '</td>');
    var input = $('<input class="input-value"></input>');
    input.val((1000/currency.value).toFixed(2));
    var td = $('<td></td>');
    input.appendTo(td);
    td.appendTo(row);
    container.append(row);
})
var inputValue = $('.input-value');
var inputActive = $('.input-value:focus')

$.each(data.results, function (key, currency) {
    inputValue.not(inputActive).keyup( function () {
        inputValue.val((inputValue.val()/currency.value ).toFixed(2));
    });
})
}

HTML :

<form name="converter"></div>
        <h4>Collecting data from: <a href="" class="m5">m5</a> <a href=""      class="arion">A bank</a> <a href="" class="lb">Lb</a></h4>
        <div>
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>Obj1</th>
                        <th>Obj2</th>
                        <th>Obj3</th>
                        <th>Obj4</th>
                        <th>Obj5</th>
                    </tr>
                </thead>
                <tbody class="currency-data">
                </tbody>
            </table>
            <div class="loader lead" style="display:none;">Loading...</div>         
        </form>

推荐答案

这对我来说有点奇怪，因为您选择了所有未聚焦的输入字段，并且在keyup事件处理程序中仅使用inputValue变量，该变量也包含焦点输入元素.顺便说一句，您不应该对data.results进行两次迭代.正如charlietfl之前评论的那样，将绑定放入迭代没有任何意义.这也是一个大错误.

That's a bit strange for me, because you select all the input field which are NOT focused, and in the keyup eventhandler you just work with the inputValue variable, which contains the focused input element too. By the way, you shouldn't iterate two times on the data.results. As charlietfl commented before it does not make any sense to put the bindings to the iteration. That's a big mistake also.

这篇关于试图使货币转换器使用jQuery工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！