Question

我正在努力让我的表单检查2个输入框在提交之前是否有任何数据输入。我遇到这个问题的原因是因为我使用以下内容 -

$('form.ajax').on('submit', function () {
    var that = $(this),
        url = that.attr('action'),
        method = that.attr('method'),
        data = {};

    that.find('[name]').each(function (index, value) {
        var that = $(this),
            name = that.attr('name'),
            value = that.val();

        data[name] = value;
    });

    $.ajax({
        url: url,
        type: method,
        data: data,
    })
    this.reset();
    return false;
});

这样就可以在没有页面刷新的情况下提交表单，当按下提交按钮时，我也会出现几秒钟的图像 -

$(".bplGame1Fade").click(function(){
$("#bplGame1ThumbUp").fadeIn(1000);
$("#bplGame1ThumbUp").fadeOut(1000); });

除非两个输入框都包含数据，否则我不希望它们运行。我尝试过使用OnClick（）和OnSubmit（）。使用这些消息时，会显示消息，表明它不是我想要的有效条目，但是一旦您单击确定，表单将继续提交。

无论如何我可以运行JS函数来检查输入框，如果其中一个框为空，则取消提交。

对此有任何帮助将不胜感激，

感谢。

Answer 1

为什么不添加if条件来检查是否有空输入？如果函数无效，您可以返回该函数。

$('form.ajax').on('submit', function () {
    var that = $(this),
        url = that.attr('action'),
        method = that.attr('method'),
        data = {};

    var context = this;
    var valid = true;
    var total = that.find('[name]').length;
    that.find('[name]').each(function (index, value) {
        var that = $(this),
            name = that.attr('name'),
            value = that.val();
        if (!value) {
            valid = false;
            return;
        }
        data[name] = value;
        if (index === total - 1) { //last item
            if (valid) {
                $.ajax({
                    url: url,
                    type: method,
                    data: data,
                });
                context.reset();
            }
        }
    });
});

编辑：您可以将ajax调用放在foreach中。所以在最后一项上，如果每个输入都有一个值，你就会进行ajax调用。

在jQuery函数之前运行Javascript函数

1 个答案: