如何在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> 

试试这个，现在可以工作了