请帮忙
我有一个带有工作JS 表单验证脚本的联系表单（代码如下）。
在表格中，我需要将输入类型从TEXT更改为TEL以获取邮政编码和电话号码（如果我使用 TEL，它将在移动设备上打开一个数字键盘而不是 QWERTY）
示例：更改<input type="text">为<input type="TEL">
如果我这样做，则该字段的验证会中断，而其他字段则有效。所以在我看来，是 JS 脚本不理解新的 Input Type。
脚本中提到了“TEXT”一词 3 次（脚本的开头、中间和结尾。我尝试将 TEXT 更改为 TEL，但没有成功。
非常感谢您的帮助！
这是验证脚本：
// Validation v5.0
var Validation = { version: '5.0' };
Validation.observe = function() {
var fields = $('[data-validate]');
fields.each(function(_,field) {
field = $(field);
var input = field.is('input') ? field : field.find('input');
// console.log('observing ' + input.attr('id'));
input.bind('keyup focusout click', function() { Validation.validate(field); });
if ((input.is(':text') && input.val()) || input.is(':checked, :selected')) input.trigger('focusout');
});
};
Validation.formats = {
zip: { format:'^\\d{5}$', message:'need a 5 digit zip' },
phone: { format:'^\\s*\\(?\\s*\\d{3}\\s*[).-]?\\s*\\d{3}\\s*[.-]?\\s*\\d{4}\\s*$', message:'need a 10 digit number' },
email: { format:'^([a-zA-Z0-9_\\-\\.+]+)@((\\[ [0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.)|(([a-zA-Z0-9\\-]+\\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\\]?)$', message:'need a valid email' }
};
// mainly just sets up variables and passes along to the right validator
Validation.validate = function(element, fireEvent) {
// console.log('validate()');
var field, format, message, result, validation, validator;
field = $(element);
Validation.clearError(field);
format = field.attr('data-format');
message = field.attr('data-error-message');
validation = field.attr('data-validate');
validator = Validation.validators[validation];
result = validator ? validator({ field:field, format:format, message:message }) :
Validation.validators.unknown(validation);
field.data('valid', result);
if (fireEvent !== false) field.trigger('validation:' + (result ? 'success' : 'failure'));
return result;
};
Validation.validators = {};
// validate the presence of the specified element, displaying an error message if it is invalid
Validation.validators.presence = function(params) {
// console.log('validators.presence()');
field = $(params.field);
message = params.message || 'required';
if (field.is('input')) {
if (!field.val()) return Validation.addError(field, message);
} else if (!field.find(':checked, :selected').length) {
return Validation.addError(field.find('input').last(), message);
}
return true;
};
// validate the given format of the specified element, displayin an error message if it is invalid
Validation.validators.format = function(params) {
// console.log('validators.format()');
field = $(params.field);
format = new RegExp(params.format);
message = params.message || 'invalid format';
if (field.is(':text') && !format.test(field.val())) {
return Validation.addError(field, message);
}
return true;
};
// shortcut to validate a zip-code format
Validation.validators.zip = function(params) {
// console.log('validators.zip()');
var zip = Validation.formats.zip;
params.format = zip.format;
params.message = params.message || zip.message;
return Validation.validators.format(params);
};
// shortcut to validate a phone number format
Validation.validators.phone = function(params) {
// console.log('validators.phone()');
var phone = Validation.formats.phone;
params.format = phone.format;
params.message = params.message || phone.message;
return Validation.validators.format(params);
};
// shortcut to validate an email format
Validation.validators.email = function(params) {
// console.log('validators.email()');
var email = Validation.formats.email;
params.format = email.format;
params.message = params.message || email.message;
return Validation.validators.format(params);
};
// if possible, log an unknown validation request
Validation.validators.unknown = function(validator) {
// console.log('validators.unknown()');
if (window.console && window.console.log) window.console.log('unknown validator: ' + validator);
return true;
};
// add an error message to the specified element
Validation.addError = function(field, message) {
// console.log('addError()');
$(field).addClass('error').after($('<span class="error_message" />').html(message || 'invalid'));
return false;
};
Validation.clearError = function(field) {
field = $(field);
if (field.is('input')) field.removeClass('error').next('.error_message').remove();
else field.find('input').removeClass('error').nextAll('.error_message').remove();
};
// check that all fields within a given container which require validation are in fact valid
Validation.allValid = function(container) {
// console.log('allValid()');
var haveError = false;
$(container).find('[data-validate]').each(function() {
if ($(this).data('valid') !== true) {
haveError = true;
}
});
return !haveError;
};
// run all validations within a given container, but don't trigger the validation event
Validation.validateAll = function(container) {
// console.log('validateAll()');
$(container).find('[data-validate]').each(function() { Validation.validate(this, false); });
return Validation.allValid(container);
};
Validation.validateAllWithValue = function(container) {
//console.log('validateAllWithValue()');
$(container).find('[data-validate]').each(function() {
if (($(this).is(':text') && $(this).val()) || $(this).find(':checked, :selected').length) {
Validation.validate(this, false);
}
});
return Validation.allValid(container);
};
function cmpRejected() {
$('form').find('.choose_error_message').fadeOut();
$('#project_info').fadeOut();
$('#contact_info').fadeIn();
trackShowContactInfoForm();
}
function cmpBridge() {
$('#bridge').fadeIn();
$('#project_info').fadeOut();
triggerMboxConversion("PDX_mEC_CS_View");
triggerSiteCatalystEvent("event3", "CS pageviews", false);
$('#bridge_container .all_wrap .cs_box').click(function() {
triggerMboxConversion("PDX_mEC_CMP_CS_Xfer");
triggerSiteCatalystEvent("event4", "CS mEC", true, false); // Passing false as the last argument means this won't actually trigger the event, since SC automatically does that when clicking a link to an external site.
});
}
$ (function (){
var has_submit = false;
$('#back_button').click(function() {
triggerMboxConversion("PDX_LF_Exit_Back");
triggerSiteCatalystEvent("event8", "LF Exit", false);
$('#project_info .main-button').val('Continue').css({opacity:'1.0',filter:'alpha(opacity=100)'}).removeAttr('disabled', 'disabled');
$('#project_info').slideDown();
$('#contact_info').fadeOut();
});
$('#contact_info').find('.submit_step').click(function() {
if(!has_submit){
$('form').submit();
}
});
$('.noThanks .CloseLink').click(function() {
triggerMboxConversion("PDX_mEC_CMP_CS_Exit_No");
triggerSiteCatalystEvent("event6", "CS Exit No", false);
$('#contact_info').fadeIn();
trackShowContactInfoForm();
$('#bridge').fadeOut();
});
$('#close_button').click(function() {
triggerMboxConversion("PDX_mEC_CMP_CS_Exit_Close");
triggerSiteCatalystEvent("event5", "CS Exit Close", false);
$('#contact_info').fadeIn();
trackShowContactInfoForm();
$('#bridge').fadeOut();
});
$('form').submit(function(){
if (Validation.validateAll( $(this).find('fieldset:visible') )) {
if($(this).find('fieldset:visible').is('#contact_info')){
has_submit = true;
triggerMboxConversion("PDX_LF_Completion");
triggerSiteCatalystEvent("event9", "LF Submit", false);
trackULead( trackingPixelTrade() );
$(this).find('input[type=submit]').val('submitting...').css({opacity:'0.5',filter:'alpha(opacity=50)'}).attr('disabled', 'disabled');
} else {
$('#step_2_zip').html($('.enterzip').val());
$('#project_info .main-button').val('loading...').css({opacity:'0.5',filter:'alpha(opacity=50)'}).attr('disabled', 'disabled');
triggerMboxConversion("PDX_rEC");
triggerSiteCatalystEvent("event1", "rEC", false);
checkCMPStepOne($(this));
return false;
}
} else {
return false;
}
});
Validation.observe();
});