jquery 输入字段数组验证

Question

我有一个页面，用户可以通过单击按钮向表单添加新字段。 我正在尝试对每个字段执行验证，包括用户通过单击按钮添加的字段。 当我执行验证时，它只检查初始字段而不是剩余字段。 我正在做的验证是确保用户存在于活动目录 (AD) 中。 到目前为止，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>

我试过的另一件事：

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>");
        });
    }
}
var userField = $("input[name='userID[]']");
userField.blur(function(){
    userField.each(function(){
        getvalues();
        var ownerUname = $(this).val();
        
    });
});

这是我的来源：

https://stackoverflow.com/questions/29148865/loop-add-to-array-on-blur
http://jsfiddle.net/5jd8N/1/

我没有很多来源，因为我正在尝试一些我认为可行的不同方法。

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

Answer 1

elements.on('blur', addElementValues);

此行仅在页面加载时调用。 添加新输入不会自动将addElementValues绑定到blur事件。 每当您添加新输入时，您都必须再次明确绑定它，或者通过取消绑定所有并重新绑定所有，或者仅绑定到新输入。

例子：

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