我正在尝试验证在IE7 + 8中使用占位符的html 5表单。
我使用了来自验证插件的jquery的valid()调用。这意味着我无法使用此解决方案:placeholder issue with jQuery Validate。我的问题是一样的。我使用的占位符脚本将占位符文本添加到value属性。调用验证时,脚本会将占位符文本作为有效输入读取。
我没有进行完全验证,因为表单分布在几个“标签”上,因此需要在显示下一部分之前进行验证。这是不可谈判的
我的占位符脚本:
$('[placeholder]').focus(function() {
var input = $(this);
if (input.val() == input.attr('placeholder')) {
input.val('');
input.removeClass('placeholder');
}
}).blur(function() {
var input = $(this);
if (input.val() == '' || input.val() == input.attr('placeholder')) {
input.addClass('placeholder');
input.val(input.attr('placeholder'));
}
}).blur();
$('[placeholder]').parents('form').submit(function() {
$(this).find('[placeholder]').each(function() {
var input = $(this);
if (input.val() == input.attr('placeholder')) {
input.val('');
}
})
});
这是我调用验证的地方:
if (elements.valid() === 0) {
valid = 0;
}
if (valid) {
$('.form').removeClass('error');
$(this).closest('section').hide().next().show();
}
非常感谢任何帮助!
答案 0 :(得分:2)
您可以尝试重新定义验证器的默认所需功能。在调用验证之前添加:
jQuery.validator.addMethod("required", function(value, element, param) {
// check if dependency is met
if ( !this.depend(param, element) ) {
return "dependency-mismatch";
}
if ( element.nodeName.toLowerCase() === "select" ) {
// could be an array for select-multiple or a string, both are fine this way
var val = $(element).val();
return val && val.length > 0;
}
if ( this.checkable(element) ) {
return this.getLength(value, element) > 0;
}
default:
var placeholderval = $(element).attr('placeholder');
//if some placeholder values are actually default values, just use "default" attribute to mark them
var defaultvar = ($(element).attr('default') === undefined);
return ($.trim(value).length > 0 && ($.trim(value)!=$.trim(placeholderval) || !defaultvar));
}, jQuery.validator.messages.required);