在.submit（）事件之后刷新表单

Question

我正在验证一份工作正常的表格，但我不知道为什么表格在所有验证后都没有提交。

这是验证码：

$('#coupon_options').submit(function(e){
    e.preventDefault();

    var name = $('input[name="coupon_name"]'), 
        code = $('input[name="coupon_code"]'), 
        value = $('input[name="coupon_value"]'), 
        valid = $('input[name="coupon_valid"]'), 
        status = true;

    if( $.trim(name.val()) == "" ){
        name.css('border-color', '#ff0000');
        status = false;
    } else { name.removeAttr('style'); }

    if( $.trim(code.val()) == "" ){
        code.css('border-color', '#ff0000');
        status = false;
    } else { code.removeAttr('style'); }

    if( $.trim(value.val()) == "" ){
        value.css('border-color', '#ff0000');
        status = false;
    } else { value.removeAttr('style'); }

    if( $.trim(valid.val()) == "" ){
        valid.css('border-color', '#ff0000');
        status = false;
    } else { valid.removeAttr('style'); }

    if( status == true ){ return status; } 
    else { return false; }

});

正如我知道在提交事件后停止刷新我使用了return false但我不确定返回true是否在这里工作？

我不想使用Ajax，只想在验证后提交。 这段代码有什么问题吗？

Answer 1

去掉：

 e.preventDefault();

即使你return true;它也会停止发生默认操作return true; 。

例如：

• 阻止提交按钮提交表单
• 阻止链接跟随URL

Answer 2

e.preventDefault(); 是问题，但你应该注意，当你有多个函数基本上为不同的元素执行相同的操作时，它永远不是一个好兆头，你可以简化你的代码：

$('#coupon_options').submit(function(e){
    var status = true;
    $('input[name="coupon_name"],input[name="coupon_code"],input[name="coupon_value"],input[name="coupon_valid"]').each(function(){
        if($.trim($(this).val()) == ""){
            $(this).css('border-color', '#ff0000');
            status = false;
        } else {
            $(this).removeAttr('style'); 
        }
    });
    return status;
});

您甚至可以使用$('input[name^="coupon_"]')来选择以该前缀开头的所有输入。