传递函数的动态 ID

Question

我正在创建具有动态ID的动态文本框。现在我想将动态文本框更改为时间选择下拉列表。我更改了脚本，但出现错误，例如未定义 id。 这是我的代码：

<div>
<input class="btn btn-info" onclick="addtextbox()" type="button" value="Add">
</div>

<script>
var count = 0;
function addtextbox() {
count++;
var newTextBoxDiv = document.createElement('div');
newTextBoxDiv.id = 'Tools';
document.getElementById("ToolsGroup").appendChild(newTextBoxDiv);
newTextBoxDiv.innerHTML = '<form class="form-inline"><div class="form-group"><label class="col-md-4 control-label" for="starttime">Starttime</label><div class="col-md-4"><input type="startime" class="form-control input-md" id="starttime' + count + '" placeholder="starttime" required=""> </div></div>' +
'<div class="form-group"><label class="col-md-4 control-label" for="endtime">Endtime</label><div class="col-md-4"><input type="endtime" class="form-control input-md" id="endtime' + count + '" placeholder="endtime" required="" onclick="timePicker()"></div></div></form>' +
'&nbsp;&nbsp;<input type="button" value="Remove" class="removeTools" onclick="removeTextArea(this);">'
console.log("Iam count", count);
};
function removeTextArea(inputElement) {
var el = inputElement;
while (el.tagName != 'DIV') el = el.parentElement;
el.parentElement.removeChild(el);
count--;
}
</script>

我的时间选择器脚本是

<script>
$(document).ready(function () {
$('#starttime'+count).timepicker({
timeFormat: 'HH:mm',
interval: 30,
use24hours: true,
scrollbar: true,
});
});
</script>

我在这里需要的是当我单击添加按钮时将创建两个文本框，当我单击文本框时，它应该以 30 小时格式的 24 分钟间隔显示时间

Answer 1

因为当页面完成加载时，my time picker script运行和变量count = 0=>渲染函数timepickerid=starttime0并且没有任何名称为starttime0的 documentId 单击添加按钮时，函数my time picker script不重新渲染，然后不让操作为id=starttime1,2,3....创建函数timepicker