Question

我有一个包含必填字段的表单，当单击提交按钮时，会出现一个加载程序图像。这有代码：

jQuery(document).ready(function($){
    {
        $.getElementById('form').onsubmit = function () {
            $.getElementById('submit').style.display = 'block';
            $.getElementById('loading2').style.display = 'block';
        };
    }(document));
)};

HTML：

<input type="submit" class="button alt"  onclick="$(\'#loading\').show();" id="place_order"/>.

我遇到的问题是当必填字段不是字段并且单击提交按钮时，将显示加载程序图像，并且当显示所需的字段错误时，加载程序图像仍会显示。

如何阻止它显示？

Answer 1

我不喜欢你这样使用jquery，

我自己做的是验证表单并使用jquery发布结果，这意味着更好地控制所有内容，因此我的代码将是这样的：

$('#formBtn').click(function(){

 $("#loading").fadeIn();
  //use some validation here and let code go to other line if validation passed

 $.post("/signup",$('#form').serialize(),function(){
        //other action like redirecting to homepage or showing a message
 }).fail(function(){
       //to show a message that submit was failed
 }).always(function(){
        $("#loading").fadeOut();
 });

})

Answer 2

使用jQuery post或get提交表单，然后在回调中验证您的响应，然后在验证完成后使用.hide（）。

Answer 3

您尝试使用 jQuery BlockUI插件可能更容易。

jQuery BlockUI Plugi

如果要阻止，可以使用

$.blockUI();

如果您想解锁，可以使用

$.unblockUI();

页面加载后删除ajax加载程序图像

3 个答案: