javascript - 仅追加所有数组项一次

Question

我正在尝试从新 div 的下拉列表中输出所有选定选项的 HTML。但是，每次我选择一个新的复选框时，我的容器都会使用所选值进行更新(就像它应该的那样)，但它还会附加下拉列表中之前选择的每个值。等等等等。如何只输出一次复选框 HTML？

这是我的 JS 代码:

let emptyArr = [];
$('.dropdown-select-container').find("option:selected").each(function(){
    emptyArr.push($(this).html());
});

for (i in emptyArr) {
  let outputResult = "<div class='arr-item'>" + emptyArr[i] + "</div>"
  $("#container").append(outputResult);
}

Answer 1

因为您使用的是 jQuery 的 append，您的 #container 将始终append(又名添加)内容outputResult 的内容，而不是替换 #container 的内容。相反，您应该使用 html 函数清空 #container 的内容，并将内容替换为 outputResult，如下所示:

$("#container").html(outputResult);