javascript - 如何在提交空白表单时隐藏图像？

Question

我有一个类似于微调器的图像，在提交表单时向用户显示。

所以在 js.coffe 中我做了这样的事情:

$('.button.save-btn.btn.btn-primary').click ->
    $('.loader').show()

如果表单验证失败并显示错误，那时我会隐藏相同的图像，如下所示:

$('#error-box').show();
$('.loader').hide();

遇到错误时，微调器可以正常工作，但现在如果用户在表单为空时单击提交按钮，该怎么办？我该如何处理该事件？在这种情况下，我到底应该在哪里隐藏旋转图像？ 我希望我正确解释了我的疑问，任何帮助将不胜感激。提前谢谢:)

Answer 1

我个人不使用咖啡，但在普通 js 中，您可以在显示旋转图像之前检查字段是否有值:

$('.button.save-btn.btn.btn-primary').click(function(){
    var form_compiled = false;

    //iterate trough each input field
    $("#MyformID").find("input, textarea").each(function(){

        //check if input field has a value or is empty
        if ($(this).val() != ""){
            form_compiled = true;
        }
    })

    // and then show the image if at least a filed is filled
    if ( form_compiled == true){
        $('.loader').show()
    }
})