Question

我有3个文本字段，可以将数据添加到表中，但是，即使所有字段都为空，我也可以将数据提交到表中，这种形式的验证是否可以与普通jQuery一起使用，或者必须与一个插件？。

Answer 1

您可以明确地全部检查它们：

// at least one is empty
if ($('#myId_1').val() == '' || $('$myId_2').val() == '') {
    alert('Oops! Please fill them all!');
}
// all are empty
if ($('#myId_1').val() == '' && $('$myId_2').val() == '') {
    alert('Oops! Please fill at least one!');
}

或者，如果您希望将来支持可变数量的字段，可以使用以下内容：

var invalid = false;
$('#table tr input:text').each(function() {
    if ($(this).val() == '') {
        invalid = true;
        return false;
    }
});

if (invalid)
    alert('Fill all the fields please!');

Here's a working example.

Answer 2

您可以使用jQuery执行此操作，而无需使用任何其他插件。这个脚本可以解决问题。请注意，它会遍历您的所有文本字段。我还为用户添加了一个视觉确认（绿色边框==确定，红色边框=='不行'）。

希望你能用它。

$('#yourSubmitButtonId').click(function(){
    var isValid = 1;
    $('input:text').each(function(){
        if($(this).val() == ''){
            $(this).css('border','1px solid red');
            isValid = 0;
            }
        else{
            $(this).css('border','1px solid green');
            }
        });

    if(isValid == 0){
        alert('Please enter content to all text fields');
        return false;
        }

    //if valid then do something
    });

Answer 3

“如果任何一个盒子都是空的，我想要一个警报，不想要函数'AddScore'被称为“

所以，我们走了。您只需要确定填充输入的数量是否小于输入总数。所以，稍微改变你的功能如下：

function AddScore() {
    var totalInputs = $('div[data-role="fieldcontain"] input:text').length;
    var nonEmptyInputs = $('div[data-role="fieldcontain"] input:text').filter(function(){return $.trim($(this).val()) !== ""}).length;
    if (nonEmptyInputs < totalInputs) {
        alert ("You've not filled all the boxes");
        return; //stop execution
    }
    //rest of the code
    var jqTableBody = $('#myTable tbody');
    ....
    ....

空文本框验证jQuery

3 个答案: