jquery - 加载图像和按钮禁用不起作用

Question

我试图在单击后禁用按钮并希望显示处理图像，但它不起作用。我的代码如下：

$('#own_message_post').ajaxForm(function(data) {

    $("#loading_img").css("visibility", "visible");
    $('#submit_form_button').attr("disabled", true);
    $('#own_message_post').append('<img src="images/loader.gif" alt="posting" id="message_post_loading_img" style="text-align: center"/>'); 
    $('#messages').prepend(data);
    $('#text_message').val("");
    $('#fileupload').val("");
    $('#submit_form_button').removeAttr('disabled');
    $('#message_post_loading_img').remove();

}); 

Answer 1

我认为您没有ajaxForm正确使用，它接受 a Options Object，而您正在传递它 a function。

在您的情况下会起作用的是：

$('#own_message_post').ajaxForm({
  beforeSubmit: function() {
    // Here you can do the things that need doing before the form is submitted
    $('#submit_form_button').prop("disabled", true);
    $('#own_message_post').append('<img src="images/loader.gif" alt="posting" id="message_post_loading_img" style="text-align: center"/>');
  },
  success: function(){
    // Here you can do the things that need doing when all is done
    $('#submit_form_button').prop("disabled", false);
    $('#message_post_loading_img').remove();
  }
});

由于看起来您正在上传文件，因此查看uploadProgress回调可能会很有用，它可以将有关上传进度的信息传回给您。

Answer 2

从 jquery 1.6 开始使用 prop()

  $('#submit_form_button').prop("disabled", true);

和

 $('#submit_form_button').prop("disabled", false);

代替

$('#submit_form_button').removeAttr('disabled');