jQuery验证动态创建的元素的错误消息

Question

我正在开发一个表单，该表单根据用户选择动态添加多达10个字段。我必须验证所有动态添加的元素。到目前为止，除了错误消息，一切都很好。例如，如果用户没有输入字段2的值并提交表单，则错误消息应该是"0"；请输入访问者2的姓名"；。如果用户没有输入字段3，则错误应变为"0"；请输入访问者3的姓名"；。除了所有字段都显示相同的消息外，我让它全部工作。假设用户添加了5个字段。所有字段都显示相同的错误消息"0"；请输入访问者5的姓名"；用于所有输入字段。

这是我的代码：

$('.visitors_name').each(function (key, value) {
$(this).rules('add', {
required: true,
minlength: 2,
maxlength: 50,
messages: {
required: "Please Enter Visitor "+key+"'s Name",
}
});
});

请帮忙吗？

Answer 1

您必须使用function来动态构造消息并使用return。。。

$('.visitors_name').each(function (key, value) {
$(this).rules('add', {
required: true,
minlength: 2,
maxlength: 50,
messages: {
required: function() {
return "Please Enter Visitor " + key + "'s Name";
}
}
});
});

演示：jsfiddle.net/6z9Lv8pk/