将html组件与JS函数动态关联

Question

我在JSP页面中有一个<input>字段。 <input>充当下拉选择框。

<input id="user_dropdown-select" name="state"  onChange="selUser(this.value)"> </input>

下拉功能封装在JavaScript函数中，该JavaScript函数通过寻址<input>字段的ID与<input>组件相关联。 通过使用$("input[id^=，可以将下拉列表与多个输入框相关联，这些输入框的ID以相同的字符串开头且需要相同的功能。

function(msg) {
    $("input[id^='user-dropdown-select']").select2({
    ...

使用上述功能，需要下拉功能的<input>框之一无法与JavaScript函数相关联。这是因为在实例化函数并将其与ID关联时，此特定输入框不存在。相反，输入框是HTML块的一部分，该HTML块创建为字符串，然后附加到另一个组件，如下所示：

$(".more_users_table").append(htmlString);

第二个输入框的创建方式无法更改。

此<input>框的ID以相同的字符串开头，但不同：

<input id="user-dropdown-select2"  </input>

因此，如果在将函数绑定到ID时存在this元素，那么它也将具有相同的功能。

将第二个输入框与JavaScript函数关联的正确方法是什么？

谢谢