Javascript 将Select2动态添加到行中

为什么当我尝试将select2添加到新行时，新的select2无法初始化（显示为select html标记）。

以下是我创建表的代码：

<table id="tbldet" class="table table-bordered table-striped table-hover" style="width:100%;margin:0 auto;">
  <thead>
    <tr>
      <th><p>Nama Barang</p></th>
      <th><p>Harga</p></th>
      <th><p>Qty</p></th>
      <th><p>Total</p></th>
      <th style="width:50px"><p>Aksi</p></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
          <select class="select2" name="det_brg" style="width:100%;">
          </select>
      </td>
      <td>10000</td>
      <td>4</td>
      <td>930000</td>
      <td><span class="btn btn-danger"><i class="fa fa-remove"></i></span></td>
    </tr>
  </tbody>
</table>

下面是添加新行的代码：

//create new row
$("#add_row").click(function(e) {
  //new row
  $("#tbldet").append(
    '<tr>\
        <td>\
            <select class="select2" name="det_brg" style="width:100%;">\
            </select>\
        </td>\
        <td>10000</td>\
        <td>4</td>\
        <td>930000</td>\
        <td><span class="btn btn-danger"><i class="fa fa-remove"></i></span></td>\
    </tr>'
  );
  var newSelect=$(this).closest("tr").find(".select2");
  initializeSelect2(newSelect);
})

//创建新行
$（“添加行”）。单击（函数（e）{
//新行
$（“#待定”）。追加(
'\
\
\
\
\
10000\
4\
930000\
\
'
);
var newSelect=$（this.closest（“tr”）.find（“.select2”）；
初始化选择2（新闻选择）；
})

---

我怀疑在新行中查找新的“select2”组件时有问题，但是当我使用

警报（newSelect）

时，它没有显示NULL/Undefined

您的怀疑是正确的，您的代码将永远找不到新的

。select2

元素。原因与

.closest（）

的工作方式有关。您可以在此处进行调查：

但与此同时：

改变

var newSelect=$(this).closest("tr").find(".select2");

至

var newSelect=$("#tbldet").find(".select2").last();

---

您的怀疑是正确的，您的代码将永远找不到新的

。请选择2

元素。原因与

.closest（）

的工作方式有关。您可以在此处进行调查：

但与此同时：

改变

var newSelect=$(this).closest("tr").find(".select2");

至

var newSelect=$("#tbldet").find(".select2").last();

---

jQuery选择器永远不会为null或未定义，如果找不到元素，它将返回长度为0的jQuery对象。当

console.log（newSelect）

时，它会显示什么？jQuery选择器永远不会为null或未定义，如果找不到元素，它将返回长度为0的jQuery对象。当

console.log（newSelect）

时显示什么？