Javascript 如果当前选项卡的字段为空，则阻止下一个选项卡

我有一个表格，上面设置了几个问题，每个问题一次显示（就像幻灯片一样）。如果当前集合有一个空字段，我想阻止下一个集合。下面是我的脚本，可以浏览每个问题集。任何帮助都将不胜感激

$(document).ready(function() {

var $questions = $('#questions .question');
var currentQuestion = $('#questions .question.active').index();

$('#next').click(function() {
    $($questions[currentQuestion]).slideUp(function() {
        currentQuestion++;
        if (currentQuestion == $questions.length - 1) {
            $('#next').css('display', 'none');
            $('#submit').css('display', 'inline');
        }else{
            $('#next').css('display', 'inline');
            $('#submit').css('display', 'none');
        }
        $('#back').css('display', 'inline');
        $($questions[currentQuestion]).slideDown();
    });
}); 

$('#back').click(function() {
    $($questions[currentQuestion]).slideUp(function() {
        currentQuestion--;
        if (currentQuestion == 0) {
            $('#back').css('display', 'none');
        } else {
            $('#back').css('display', 'inline');
        }
        $('#next').css('display', 'inline');
        $('#submit').css('display', 'none');
        $($questions[currentQuestion]).slideDown();
    });
});

}))

---

这是我的

我无意中发现了你的问题，决定向你请教

在继续下一个选项卡之前，您应该创建一个检查您的条件的函数。
在您的情况下，条件是：必须填写所有字段

我添加了这个函数，它检查活动部分并返回true/false，以便继续

function validateFormSection() {
    var valid = true; //As long as it's true, we may continue
    var section = $('.question.active'); //Find the active section
    var inputs = section.find('input'); //Get all its inputs
    inputs.each(function(index, el) {
        if ( $(el).val() == "" ) {
            valid = false;
        }
    });
    return valid;
}

在第三页，无论所有字段是否为空，表单都将提交。
您可以通过挂接submit函数并检查空字段来防止出现这种情况。
如果它们为空，则使用

e.preventDefault（）以防止其提交。

如果已填写，我们只需通过执行
$（'form'）提交即可

已编辑小提琴以反映这些更改。
您可以使用
if（！$（'.question'）.eq（currentQuestion）.find（'input'）.filter（function（）{return this.value==''）.length）
检查是否有空字段。小提琴：


$（'.question'）
选择所有问题
.eq（currentQuestion）
选择您当前的问题
.find（'input'）
选择当前问题中的所有输入字段
.filter（function（）{返回此.value==“”}）
仅选择空输入字段
.length
统计匹配的数量，例如空输入的数量
if（number）
返回带有正值的
true
，例如，如果存在任何空输入
将其全部反转，如果没有空字段，则返回
true

谢谢@Ilpo，不过米切尔的剧本更可取。我已经更新了小提琴：我在上面发布的聊天室里有更多信息
$('form').submit( function (e) { //Hook into the submit event
    var valid = validateFormSection(); //Check if our fields are filled
    if ( valid ) { //They are filled?
        $('form').submit(); //Very well, let's submit!
    } else {
        e.preventDefault(); //If not, prevent the (default) submit behaviour
    }
});