我为一系列输入标签编写了一个简单的验证函数。这些工作第一次很好,但是当我使用jQuery重写父div html时,模糊函数不再触发。
基本上,除非所有输入字段都有效,否则脚本将不允许调查问卷前进到下一页。一旦所有输入字段都确认后,我会复制问卷的当前“页面”并将其存储在名为previousPage的变量中 - 这样,如果用户点击(以及之前输入的值),我可以重写问卷。
一切正常 - 直到用户在“返回”时更改输入,但由于模糊事件未触发,因此验证未运行且表单可以在不完整的情况下进行。
这是我的模糊钩子:
$("body").on('blur', 'input', function(){
rules = '';
rulesValues = '';
lastInput = $(this).attr('id');
if($(this).data('rules')){
rules = $(this).data('rules').split(',');
}
if($(this).data('rules-values')){
rulesValues = $(this).data('rules-values').split(',');
}
validateData = $(this).val();
if(rules && rulesValues){
$.each(rules, function(index, value) {
validationResult = inputValidator(rules[index],rulesValues[index],validateData);
if(validationResult !== "PASSED"){
$('#'+lastInput+'').after('<div class="validationFail">'+validationResult+'</div>');
$('#'+lastInput+'').addClass('emptyInput');
incomplete = true;
}else{
incomplete = false;
}
});
}
});
这是一个说明问题的小提琴: Fiddle