javascript - 使用javascript计算对应字段

Question

我是 jQuery 的初学者，需要弄清楚如何在另一个字段发生更改时自动更新一个字段。当输入字段更改时，我的代码适用，但我不知道如何查找(和更改)相应的字段。这是 jsFiddle

HTML:

<div>
    <div id='auto-calc'>
            <input></input>
    </div>
    <div>
        <p>(cm)</p>
    </div>
</div>
<div>
    <div id='auto-calc'>
            <input></input>
    </div>
    <div >
        <p>(inches)</p>
    </div>
</div>
<div>
    <div id='auto-calc'>
            <input></input>
    </div>
    <div>
        <p>(kg)</p>
    </div>
</div>
<div>
    <div id='auto-calc'>
            <input></input>
    </div>
    <div>
        <p>(lbs)</p>
    </div>
</div>

JavaScript:

$(document).ready(function() {
    $('#auto-calc input').change(function () {
        alert($(this));
    });
});

因此，如果(厘米)改变，我想自动改变(英寸)，反之亦然。 (公斤) <--> (磅) 相同。

有什么想法吗？我知道我已经很接近了，只是我无法弄清楚最后一小部分

这个 html 将在我的整个表单中重复。因此会有几个 cm/in 和 lbs/kg 字段需要相互对应

Answer 1

如果您有多个具有相同单位的字段，则更容易使用类作为输入，例如 class="cm"，并将相应的字段分组在一起。此调整后的 Fiddle 中 inch 到 cm 的示例:

$(document).ready(function () {
  $('.cm').change(function () {
    $(".inch").val($(this).val() / 0.393701);
 });
});

如果你愿意，例如使用 fieldgroup 类对容器 div 中的相应字段进行分组，可以将其调整为

$(document).ready(function () {
  $('.cm').change(function () {
    $(this).closest(".fieldgroup").find(".inch").val($(this).val() / 0.393701);
 });
});

仅更改相应英寸输入的值。