如何在jQuery選擇器中包含變量？

Question

在我的JavaScript中，我有一個名為counter的變量。 我想將其附加到我使用腳本動態創建的選擇標簽的ID上，例如-

// Creating a <div>
var random_div = $(document.createElement('div'))
                 .attr("class", "col-md-7");

counter = 5;

random_div.after().html('<select multiple class="js-example-basic-multiple" name="tal' + counter + '" id="tal' + counter + '" > </select>');

random_div.appendTo(main_div);

現在，我正在嘗試解析此新創建的select標簽的寬度，但是它不起作用-

$("#tal" + counter).select2({width: 'resolve'});

我什至嘗試了另一個變量，但這也不起作用-

var testing = '#tal' + counter;
$(testing).select2({width: 'resolve'});

現在，如果我將其硬編碼為$("#tal5").select2({width: 'resolve'}); ， 有用。

這真的很基礎，但是我似乎找不到解決方案。

Answer 1

不要查找元素，使用jQuery生成元素並使用引用

const select = $('<select ...></select'); // make the select
yourElem.append(select) // add it
select.select2({width: 'resolve'}); // fire the select2

Answer 2

由於遺漏了單引號和雙引號而導致了一些js錯誤

  var random_div = $(document.createElement('div')) .attr("class", "col-md-7"); counter = 5; random_div.after().html('<select multiple class="js-example-basic-multiple" name="tal'+counter+'" id="tal'+counter+'" > </select>'); console.log($(random_div).find('#tal'+counter)[0]) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 

試試這個，現在可以工作了