0
我有一個表單驗證用戶輸入。當用戶單擊提交按鈕並且一個或多個必填字段爲空時,字段或標籤右側會顯示「必需」消息,頂部和底部會顯示一條常規消息。這似乎工作正常。但是,當我通過更新其中一個空的必填字段來測試表單時,即使其他必填字段保留空白,一般消息也會消失。我怎樣才能防止這一點?我很感激任何幫助。謝謝 - DJH如何防止JavaScript錯誤消息在多次更正後首先隱藏?
$(document).ready(function() {
$('form').submit(function(event){
var isErrorFree = true;
$('input.required, select.required, textarea.required',this).each(function(){
if (validateElement.isValid(this) == false){
isErrorFree = false;
};
});
return isErrorFree;
return getFocus;
}); // close .submit()
var validateElement = {
isValid:function(element){
var isValid = true;
var $element = $(element);
var id = $element.attr('id');
var name = $element.attr('name');
var value = $element.val();
var hideMsg = true;
// <input> uses type attribute as written in tag
// <textarea> has intrinsic type of 'textarea'
// <select> has intrinsic type of 'select-one' or 'select-multiple'
var type = $element[0].type.toLowerCase();
switch(type){
case 'text':
case 'textarea':
case 'password':
if (value.length == 0 ||
value.replace(/\s/g,'').length == 0){ isValid = false; hideMsg = false; }
break;
case 'select-one':
case 'select-multiple':
if(!value){ isValid = false; hideMsg = false; }
break;
case 'checkbox':
case 'radio':
if($('input[name="' + name +
'"]:checked').length == 0){ isValid = false; hideMsg = false; };
break;
} // close switch()
var method = isValid ? 'removeClass' : 'addClass';
var msgStat = hideMsg ? 'removeClass' : 'addClass';
if (type == 'checkbox' || type == 'radio') {
// if radio button or checkbox, find all inputs with the same name
$('input[name="' + name + '"]').each(function(){
// update each input elements <label> tag, (this==<input>)
$('#errorMessage_' + name)[method]('showErrorMessage');
$('#errorMessage1')[msgStat]('showErrorMessage');
$('#errorMessage2')[msgStat]('showErrorMessage');
});
} else {
// all other elements just update one <label>
$('#errorMessage_' + name)[method]('showErrorMessage');
$('#errorMessage1')[msgStat]('showErrorMessage');
$('#errorMessage2')[msgStat]('showErrorMessage');
}
// $('#errorMessage1')[msgStat]('showErrorMessage');
// $('#errorMessage2')[msgStat]('showErrorMessage');
// after initial validation, allow elements to re-validate on change
$element
.unbind('change.isValid')
.bind('change.isValid',function(){ validateElement.isValid(this); });
return isValid;
// close validateElement.isValid()
// close validateElement object
// close ready object
我會再看看。謝謝。 – Don 2011-02-16 14:59:18