javascript - 尝试使用 jQuery 让货币转换器工作

Question

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

正如您在下面的代码中看到的，我试图使 keyup 函数适用于除当时正在输入数字的输入之外的所有内容。我的函数输出结果也不正确。

如果有人能指出我在这里犯的非常明显的错误，那将非常有帮助!

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>

Answer 1

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