Javascript jquerymultiselect无法处理动态添加到html页面中的元素

我使用js动态创建元素，调用js函数如下

function addElement(){
    var counter = 1;
    var newdiv = document.createElement('div');
    newdiv.id='dynamicdiv' + counter;
    newdiv.innerHTML += "<select class=\"checkedValues\" multiple=\"multiple\"><option value=\"1\">One</option><option value=\"2\">Two</option></select>";
    document.getElementById(divName).appendChild(newdiv);
    counter++;
}

---

此效果在动态注入的元素上不起作用。如何应用它？

您必须在注入元素后再次调用它，因为加载DOM时，您的第一个代码只执行一次，而在加载DOM后，您将通过js向DOM添加元素：

function addElement(){
    var counter = 1;
    var newdiv = document.createElement('div');
    newdiv.id='dynamicdiv' + counter;
    newdiv.innerHTML += "<select class=\"checkedValues\" multiple=\"multiple\"><option value=\"1\">One</option><option value=\"2\">Two</option></select>";
    document.getElementById(divName).appendChild(newdiv);
    counter++;

    $(newdiv).find('.checkedValues').multiselect({
     includeSelectAllOption: true
   });  // call it here again
}

---

在注入元素后，您必须再次调用它，因为加载DOM时，您的第一个代码只执行一次，并且在加载DOM后，您通过js向DOM添加元素：

function addElement(){
    var counter = 1;
    var newdiv = document.createElement('div');
    newdiv.id='dynamicdiv' + counter;
    newdiv.innerHTML += "<select class=\"checkedValues\" multiple=\"multiple\"><option value=\"1\">One</option><option value=\"2\">Two</option></select>";
    document.getElementById(divName).appendChild(newdiv);
    counter++;

    $(newdiv).find('.checkedValues').multiselect({
     includeSelectAllOption: true
   });  // call it here again
}

---

您需要调用新元素上的代码。代码不会神奇地侦听要添加到页面的新元素

var counter = 1;

function addElement() {
  var newdiv = $("<div/>", {
    id: 'dynamicdiv' + counter
  });
  var select = $("<select class=\"checkedValues\" multiple=\"multiple\"><option value=\"1\">One</option><option value=\"2\">Two</option></select>");
  newDiv.append(select);
  $("#" + divName).append(newdiv);
  select.multiselect({
    includeSelectAllOption: true
  });
  counter++;
}

---

您需要调用新元素上的代码。代码不会神奇地侦听要添加到页面的新元素

var counter = 1;

function addElement() {
  var newdiv = $("<div/>", {
    id: 'dynamicdiv' + counter
  });
  var select = $("<select class=\"checkedValues\" multiple=\"multiple\"><option value=\"1\">One</option><option value=\"2\">Two</option></select>");
  newDiv.append(select);
  $("#" + divName).append(newdiv);
  select.multiselect({
    includeSelectAllOption: true
  });
  counter++;
}

---

在附加以下内容后，可以将multiselect绑定到最近添加的项：

 function addElement(){
  var counter = 1;
  var newdiv = document.createElement('div');
  newdiv.id='dynamicdiv' + counter;
  newdiv.innerHTML += "<select class=\"checkedValues\" multiple=\"multiple\"><option value=\"1\">One</option><option value=\"2\">Two</option></select>";
  document.getElementById(divName).appendChild(newdiv);
  counter++;

  $('#'+divName+' .checkedValues:last').multiselect({
     includeSelectAllOption: true
  }); 
}

---

在附加以下内容后，可以将multiselect绑定到最近添加的项：

 function addElement(){
  var counter = 1;
  var newdiv = document.createElement('div');
  newdiv.id='dynamicdiv' + counter;
  newdiv.innerHTML += "<select class=\"checkedValues\" multiple=\"multiple\"><option value=\"1\">One</option><option value=\"2\">Two</option></select>";
  document.getElementById(divName).appendChild(newdiv);
  counter++;

  $('#'+divName+' .checkedValues:last').multiselect({
     includeSelectAllOption: true
  }); 
}

---

停下来想一想…代码如何转换还不存在的东西？自然，谢谢：停下来想一想…代码如何转换还不存在的东西？自然，谢谢：应该只针对新元素，而不是整个类应该只针对新元素，而不是整个类