0

我正在使用这样的代码（简化）：

var $form = $('form')
var els = {
  radio: $form.find('input[type=radio]'),
  check: $form.find('input[type=checkbox]')
}

有form问题的可能包含动态添加的输入，但els对象在定义时是静态的，如果表单获得新的输入，radio并且check不会更改。我需要els在整个代码中经常使用，所以我想出了这个简单的解决方案：

var getEls = function () {
  return {
    radio: $form.find('input[type=radio]'),
    check: $form.find('input[type=checkbox]')
  }
}

var foo = function () {
  var els = getEls()
  // do something with `els`
}

这很好用，但我认为这可能不会提供最佳性能，因为它每次都必须再次查询所有元素。有一个更好的方法吗？

4

1 回答 1

1

如果您不调用getEls()循环或其他性能应该没问题。但是，由于您控制向表单添加元素，因此您有一些方法可以简化代码。

使用属性

使用表单上的数据属性来保存特定元素的数量，以便在完全刷新之前将其与保存的元素数量进行比较。

function() {
    var checkBoxCount = parseInt($form.data("checkbox-count"), 10);
    $("form").append("<input type='checkbox'>");
    // now increment the count and re-save it
    $form.data("checkbox-count", checkBoxCount+1);
};

更新集合

在将对象添加到 dom 时，您也可以将其添加到已保存的集合中。

function() {
    var $checkbox = $("<input type='checkbox'>");
    $("form").append($checkbox);
    els.check = els.check.add(checkbox);
};
于 2012-07-25T00:13:48.020 回答