本文介绍了引导未应用于动态创建的元素的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试制作一个计算器，如果您愿意，您可以在其中增加输入的数量-计算器本身在寻找必要的值方面工作得很好，但我也希望能够搜索下拉输入，因为它们确实很长，因此我使用bootstrap-select。
问题是只有默认输入才会应用引导主题，而通过单击必要按钮创建的输入不会应用主题。我如何着手修复此问题？
您期望的是什么？所有输入都像默认输入一样设置了"样式"，并带有搜索菜单等。您会看到什么？只有默认输入是"带样式的"，而通过单击按钮创建的输入不会
数据-lang="js"数据-隐藏="假"数据-控制台="真"数据-巴贝尔="假">var i = 0;
function createGear() {
i++;
var container = document.getElementById("newGear");
var gear = document.createElement("select");
gear.id = "gear" + i;
gear.setAttribute("class", "selectpicker");
gear.setAttribute("data-live-search", "true");
container.appendChild(gear);
var none = document.createElement("option");
none.value = "none";
none.text = "";
gear.add(none);
var pistols = document.createElement("optgroup");
pistols.label = "Pistols";
gear.add(pistols);
var pistol1 = document.createElement("option");
pistol1.value = "pistol1";
pistol1.text = "M1911";
gear.add(pistol1);
pistols.appendChild(pistol1);
return i;
}<!DOCTYPE html>
<html>
<head>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.min.css" />
<script src="js/script.js" type="text/javascript"></script>
</head>
<body>
<form id="form">
<select class="selectpicker" data-live-search="true" id="gear0">
<option></option>
<optgroup label="Pistols">
<option value="pistol1">M1911</option>
</optgroup>
</select>
<div id="newGear">
</div>
<input type="button" onclick="createGear()" value="Create Gear Input!">
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.min.js"></script>
</body>
</html>