如何使用 JQuery 验证 HTML 表格中动态添加的单元格？

Question

我正在开发一个 Web 应用程序，该应用程序具有一个 HTML 表格，其中仅在加载时生成标题。然后，我使用添加按钮使用 javascript 函数将行添加到表中。基本上该表有 3 列，在添加一行时，我将一个文本框附加到每个单元格，以便每列有 3 个文本框。这些文本框用于接受用户数据，这些数据随后被收集并发送到服务器。 但是，我需要为每个单元格添加一个 JQuery 验证，以允许用户在这些文本框中仅输入数字。我是 JQuery 新手，不清楚如何在 document.ready() 函数中添加代码来识别稍后将使用添加按钮添加的文本框元素并对其应用验证。我正在尝试这样的事情，但它似乎不起作用！

$(document).ready(function () {

    $("input[type=text]").live('focusout', validate({
        rules: {                        
            number: true                        
        }
    }));

});

如果有人可以指导我，将不胜感激...在此先感谢！

Answer 1

您正在运行的函数会在页面加载时连接事件。之后添加的项目不会被挂钩。

将代码包装在自己的函数中，并在添加每个表格行后调用它。

$(document).ready(function () {
     setValidation()
});

function setValidation() {
    $("input[type=text]").live('focusout', validate({ rules: {number: true}}));
}