Javascript jquery输入字段数组验证

我有一个页面，用户可以通过单击按钮向表单添加新字段。我试图对每个字段执行验证，包括用户通过单击按钮添加的字段。当我执行验证时，它只检查初始字段，而不检查剩余字段。我正在进行的验证是确保用户存在于active directory（AD）中。到目前为止，广告验证是有效的（我在多个页面上使用它），但它没有对每个字段执行检查。我已经尝试了一些方法，我也在下面发布了这些方法。我不太擅长javascript，所以如果这是一个明显的问题，我很抱歉

<script>
$(document).ready(function(){
var elements = $('#userID');
function getvalues(){
    var inps = document.getElementsByName('userID[]');
    for (var i = 0; i <inps.length; i++) {
        var inp=inps[i];
        $.post("../config/getDisplayName.php",{requester: inp.value}, function(data, status){
            $("#ownerUnameDisplayName").append(data);
            $("#ownerUnameDisplayName").append("<br>");
        });
    }
}
function addElementValues(){
    var sum = 0;
    elements.each(function(){
        sum += parseFloat(this.value);
    });
    getvalues();
}
elements.on('blur', addElementValues);
# This is the portion of the script that adds the additional fields. This works as expected.
$("#addPerson").click(function(){
    $("<input name='userID[]' id='userID' class='w3-input w3-border entryField' type='text' placeholder='User ID' required>").appendTo("#contactCardData");
    $("<input name='lastname[]' class='w3-input w3-border entryField' type='text' placeholder='Last Name' required>").appendTo("#contactCardData");
    $("<input name='firstname[]' class='w3-input w3-border entryField' type='text' placeholder='First Name' required>").appendTo("#contactCardData");
    $("<input name='externalAddress[]' class='w3-input w3-border entryField' type='text' placeholder='Email/Phone Number' required>").appendTo("#contactCardData");
});
});
</script>

我没有太多的消息来源，因为我尝试了一些我认为有效的不同的方法

正如我上面所说，我已经尝试了上面的代码，但它只影响第一个字段。我需要能够验证后，“添加人”按钮点击每个字段

elements.on('blur', addElementValues);

此行仅在页面加载时调用。添加新输入不会自动将

addlementvalues

绑定到

blur

事件。无论何时添加新输入，您都必须再次显式绑定它，方法是取消绑定所有并重新绑定所有，或者仅绑定到新输入

例如：

...append("<input data='new' ...>");
$("input[data=new]").removeAttr("data").on("blur", addElementValues);

…追加（“”）；
$（“input[data=new]”。删除（“data”）。打开（“blur”，addElementValues）；

elements.on('blur', addElementValues);

...append("<input data='new' ...>");
$("input[data=new]").removeAttr("data").on("blur", addElementValues);