javascript - 在动态创建的元素上运行 jQuery.each()

Question

我有以下代码；

$('#btnSave').click(function (e) {
    $("input:text").each(function (index, value) {
        var el = $(this);
        if (el.val().length == 0) { el.css('border', '1px solid red') }
        return false;
    });
});

在这里，所有输入文本元素都是动态创建的，因此我永远无法验证它们是否为空..

我该如何使用.on()with .each()？我用谷歌搜索没有运气..提前谢谢..

Answer 1

您的代码非常好，但去掉return false;. 它在第一个输入被击中后停止.each()循环。

jsFiddle 示例

Answer 2

除非当您单击页面时元素不在页面上，否则这应该不是问题。也因为您要返回 return false ; 当该字段为空时，只有第一个文本框将被赋予边框..即使为空，其他文本框也会被忽略..

尝试这个

​$(function() {
    $('#btn1').on('click' , function() {
        var inp = '';
        for(var i=1;i< 6;i++){
           inp += '<input type="text" id="txt' + i + '"/>'
        }   
        $('.textboxes').append(inp);

       var isError = false;
       $("input:text").each(function (index, value) {
            var el = $(this);
            if (el.val() == '') { 
               el.addClass('error');
               isError = true;
            }
        });

            if(isError){return false;}    
    });    

});​

还要检查这个工作示例...... FIDDLE