檢查輸入字段爲空的字段使用jQuery

我試着以確保在提交這些領域的arent空的，如果是這樣，添加一個類，如果沒有，則返回true - 即使字段爲空，表單仍然提交，但僅在沒有運氣的情況下嘗試以下操作。

$('.submit').click(function(){ 

if($('.required').val() == "") { 
     $('.required').addClass('error'); 
     return false; 
    } else { 
     return true; 
    }; 
});

來源

2013-03-22 Liam

在表單 – Sam 2013-03-22 16:25:30

嘗試：

$('.submit').click(function(e){ 
if(!$('.required').val()) { 
    $('.required').addClass('error'); 
    e.preventDefault(); 
    } else { 
    return true; 
    }; 
});

來源

2013-03-22 16:25:49 Anujith

上添加onsubmit事件的功能即使只有一個字段爲空，類「.error」也會被添加到每個字段中。 – dfsq 2013-03-22 16:31:02

不會只檢查集合中的第一個'.required'元素嗎？ – 2013-03-22 16:35:52

這將用'.error'類替換所有'.required'輸入。我用另一個答案回答。 – Alex 2013-03-22 17:18:53

if($('.required')將返回的jQuery對象的集合，而調用.val()將只使用集的第一個元素進行測試。

嘗試這樣（編輯：不需要做一個循環或測試，因爲對應濾網EXPR會照顧的，對你）：

$('.submit').click(function(e) { 
    var ins = $('input.required[value=""]');   
     ins.addClass('error'); 
     return false; 
    } 
    return true; 
}

來源

2013-03-22 16:28:54

您應該使用過濾器來獲得空字段。表單提交也更好用，以便它也能處理輸入按鍵。如果沒有，那麼你將不得不處理輸入表單內的按鍵將觸發表單的提交事件

$('yourform').submit(function(){ 
    // empty will contain all elements that have empty value 
    var empty = $('.required').filter(function(){ 
     return $.trim(this.value).length === 0; 
    }); 
    if(empty.length){ 
     empty.addClass('error'); 
     return false; 
    } 
});

來源

2013-03-22 16:30:19

試試這個：

$('.submit').click(function() { 
    $('.required').removeClass('error').filter(function() { 
     return !$.trim(this.value).length; 
    }).addClass('error'); 
});

類error加入到空字段只和否則將被刪除。

http://jsfiddle.net/dfsq/2HxaF/

另一種變化，這可以爲你的任務非常有用：上田額外的驗證模糊：

$('.submit').click(validate); 
$(document).on('blur', '.required', function() { 
    validate($(this)); 
}); 

function validate($field) { 
    ($field instanceof jQuery && $field || $('.required')).removeClass('error').filter(function() { 
     return !$.trim(this.value).length; 
    }).addClass('error'); 
}

http://jsfiddle.net/dfsq/2HxaF/1/

來源

2013-03-22 16:33:02 dfsq

有點遲到了，但我認爲這是最好的解決方案：

替換未填寫的所有必填字段： http://jsfiddle.net/LREAh/

$('form').submit(function(){ 
if(!$('.required').val()) { 
    $('.required').attr('placeholder', 'You forgot this one'); 
    return false; 
    } else { 
     return true; 
}; 
});

僅更換提交的表單的必填字段：http://jsfiddle.net/MGf9g/

$('form').submit(function(){ 
if(!$(this).find('.required').val()) { 
    $(this).find('.required').attr('placeholder', 'You forgot this one'); 
    return false; 
} else { 
    return true; 
} 
});

當然你也可以更改爲attr('placeholder', 'You forgot this one');addClass('error'); - 這是僅用於演示。你不需要HTML btw上的id="formX"，我只是在嘗試其他的東西，並忘記刪除。

來源

2013-03-22 17:09:44 Alex

檢查輸入字段爲空的字段使用jQuery

回答

相關問題