如何 DRY javascript 代码以最小化冗余

Question

关于 DRYing 代码，我是 Javascript 的新手。有人可以帮我 DRY 这个 javascript 代码

这是 JS 代码从中获取数据的地方：

<div class="form-group">
    @Html.LabelFor(model => model.eMP.EMPNO, "Employee Number", htmlAttributes: new { @class = "control-label" })
    @Html.EditorFor(model => model.eMP.EMPNO, new { htmlAttributes = new { @class = "form-control", @id = "EMPNO" } })
    @Html.ValidationMessageFor(model => model.eMP.EMPNO, "", new { @class = "text-danger" })
</div>

这就是价值应该去的地方：

<div class="form-group">
    @Html.LabelFor(model => model.Emp_educ.EMPNO, "EMPNO", htmlAttributes: new { @class = "control-label" })
    @Html.EditorFor(model => model.Emp_educ.EMPNO, new { htmlAttributes = new { @class = "form-control", @id = "EMPNOEDUC", readOnly = "readonly" } })
    @Html.ValidationMessageFor(model => model.Emp_educ.EMPNO, "", new { @class = "text-danger" })
</div>

到目前为止，这是我的代码，我目前正在尝试尽量减少代码的冗余。有没有办法干掉这段代码？

$(document).ready(function () {
    $("#EMPNOEDUC").val($("#EMPNO").val());
    $("#EMPNOJOBHIST").val($("#EMPNO").val());
    $("#EMPNOREFERENCE").val($("#EMPNO").val());
    $("#EMPNOLICENSES").val($("#EMPNO").val());
});

Answer 1

在输入中添加一个class，然后您可以在一行中设置值$("#EMPNO").val()

$(document).ready(function () {
    $(".myinputs").val($("#EMPNO").val());
});

Answer 2

您可以在组合 jQuery 选择器中列出目标 ID，如下所示：

$("#EMPNOEDUC, #EMPNOJOBHIST, #EMPNOREFERENCE, #EMPNOLICENSES").doSomething(...)

演示：

$(document).ready(function() {
  $("#EMPNOEDUC, #EMPNOJOBHIST, #EMPNOREFERENCE, #EMPNOLICENSES").val($("#EMPNO").val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Source:<br />
<input id="EMPNO" value="123456" /><br />
<br />
Targets:<br />
<input id="EMPNOEDUC" /><br />
<input id="EMPNOJOBHIST" /><br />
<input id="EMPNOREFERENCE" /><br />
<input id="EMPNOLICENSES" /><br />

如何 DRY javascript 代码以最小化冗余

How to DRY javascript code to minimize redundancy

javascript

dry