缩短用于从 HTML 元素中提取值的 JavaScript 代码

Question

我有 JavaScript 代码，可以从多个 HTML 输入元素中提取值。该代码按预期工作，但相当冗长且重复。我正在寻找在保持其功能的同时缩短它的方法。

这是原始代码。有没有更简洁高效的方法来达到同样的效果？

var UserDefinedFieldValues = {
  txtTB1: $('#<%= txtTB1.ClientID %>').val(),
  txtTB2: $('#<%= txtTB2.ClientID %>').val(),
  txtTB3: $('#<%= txtTB3.ClientID %>').val(),
  txtTB4: $('#<%= txtTB4.ClientID %>').val(),

  DecimalTB1: $('#<%= DecimalTB1.ClientID %>').val(),
  DecimalTB2: $('#<%= DecimalTB2.ClientID %>').val(),
  DecimalTB3: $('#<%= DecimalTB3.ClientID %>').val(),
  DecimalTB4: $('#<%= DecimalTB4.ClientID %>').val(),

  DateTB1: $('#<%= DateTB1.ClientID %>').val(),
  DateTB2: $('#<%= DateTB2.ClientID %>').val(),
  DateTB3: $('#<%= DateTB3.ClientID %>').val(),
  DateTB4: $('#<%= DateTB4.ClientID %>').val(),

  RcbDD1: $('#<%= rcbDD1.ClientID %>').val(),
  RcbDD2: $('#<%= rcbDD2.ClientID %>').val(),
  RcbDD3: $('#<%= rcbDD3.ClientID %>').val(),
  RcbDD4: $('#<%= rcbDD4.ClientID %>').val(),

  ctrlDateTB1: $find("<%= DateTB1.ClientID %>"),
  ctrlDateTB2: $find("<%= DateTB2.ClientID %>"),
  ctrlDateTB3: $find("<%= DateTB3.ClientID %>"),
  ctrlDateTB4: $find("<%= DateTB4.ClientID %>"),

  ctrlRcbDD1: $find('<%= rcbDD1.ClientID %>'),
  ctrlRcbDD2: $find('<%= rcbDD2.ClientID %>'),
  ctrlRcbDD3: $find('<%= rcbDD3.ClientID %>'),
  ctrlRcbDD4: $find('<%= rcbDD4.ClientID %>'),
};

Answer 1

答案当然是肯定的，有更简洁、更有效的方法，但是如果不查看 HTML 和实际使用，就不可能向您展示。

我强烈的感觉是你有一个函数需要被委托并使用相对访问来访问同级字段，例如

$(this).closest('someContainer').find('.date')

我当然不会使用 ASP ID，而是使用一些更好的方法来访问字段/元素