javascript - 基于参数的不同功能行为

Question

我是 jQuery/Javascript 的新手，所以我不确定这是否可能。我有一个简单的函数，它可以删除元素、添加一个类并禁用一个输入按钮：

function removeElements() {
  $("#dragAndDropFiles, placeHolderImage").remove();
  $(".dragDropTag, .dragDrop, .dragDropIcon, #multiUpload").addClass("dropped");
  $("#multiUpload").prop('disabled', true);
}

稍后我将需要从本质上反转此功能（即，重新添加所有元素，删除类并启用输入按钮。我可以通过添加另一个功能来做到这一点：

function addElements() {
  $("#dragAndDropFiles, placeHolderImage").append('<div>markup here</div>');
  $(".dragDropTag, .dragDrop, .dragDropIcon, #multiUpload").removeClass("dropped");
  $("#multiUpload").prop('disabled', false);
}

我的问题是，这是否可以以某种方式进行优化，这样我就不必编写两个函数了？例如，我可以将它包装成一个重复较少的函数吗？（例如，不是为了添加/删除类或启用/禁用输入字段而重写相同的行，而是让一行代码根据传入的参数执行不同的操作？）

Answer 1

基本上，你可以做这样的事情：

function setElements(remove) {
  var dropIds = $("#dragAndDropFiles, placeHolderImage");
  var dropClasses = $(".dragDropTag, .dragDrop, .dragDropIcon, #multiUpload");

  if (remove) {
    dropIds.remove();
    dropClasses.addClass("dropped");
  } else {
    dropIds.append('<div>markup here</div>');
    dropClasses.removeClass("dropped");
  }

  $("#multiUpload").prop('disabled', remove);
}