使用 jQuery 将值从一个输入镜像到另一个输入

Posted 2023-05-09

【中文标题】使用 jQuery 将值从一个输入镜像到另一个输入

【英文标题】：Mirroring value from one input to another using jQuery

【发布时间】：2021-08-12 17:48:16

【问题描述】：

我在这里找到了一些与此相关的帖子，但它们都只以一种方式起作用，例如：

$("#a").on("change",function()  $(".aa").val($(this).val()); );

但我需要弄清楚当其中一个输入更新时如何更改其中一个输入。目前我的两个字段看起来像这样，使用上面的代码从第一个到第二个都可以正常工作，但是如果有人更改了第二个输入，我需要第一个也更新。我有多个需要应用此功能的字段，所以我真的不想只是反转功能。

<input type="text" id="a" class="aa required standard" placeholder="0"/>
<input type="text" class="aa required standard" placeholder="0"/>

【参考方案1】：

既然它们都共享同一个类，为什么不只针对该类并将更改传播到该类的其他字段：

$(".aa").on("change",function()  $(".aa").val($(this).val()); );

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="a" class="aa required standard" placeholder="0"/>
<input type="text" class="aa required standard" placeholder="0"/>

您甚至可以将其包装在一个函数中，以便与其他字段一起使用

function propagateChanges(cls)
    $(cls).on("change",function()  $(cls).val($(this).val()); );

【讨论】：

是的，在提问时刚刚考虑了添加类，但又有点冗长......但我可以设置变量并使用您刚才提到的函数。这会很好地完成工作！