jquery - 在所有 jquery 函数事务完成后调用 jquery fadein()？

Question

我有一个提交按钮，当用户点击提交按钮时，我想在 jquery 中使用 fadein() 启动一个 Div，从同一个函数我调用另一个名为monthlyReport() 的函数，但是这个 fadein div 在之后被调用montlyReport 被调用，其功能结束

<script type="text/javascript">
$(function () {
    $("#submitbtn").click(function () {
        $("#loading").fadeIn();
        monthlyReport($(this));
    });
});


function monthlyReport(Obj1) {

  //some transactions

  alert('test');

}

<div id="loading">
<div id="loadingcontent">
    <p id="loadingspinner">
        Searching things...
    </p>
</div>
</div>

我的要求是 $("#loading").fadeIn(); 应该首先触发然后monthlyReport() 可以继续其事务

Answer 1

设置在 fadeIn() 函数完成后发生的monthlyReport 调用：

$(function () {
    $("#submitbtn").click(function () {
        var self = this;
        $("#loading").fadeIn('slow', function() {
           monthlyReport($(self));
        });
    });
});

function monthlyReport(Obj1) {    
  //some transactions

  alert('test');    
}

编辑：修改代码以将变量设置self为单击处理程序中 this 的值。

Answer 2

像这样：

$(function () {
    $("#submitbtn").on('click', function () {
        $("#loading").fadeIn('slow', function() {
           monthlyReport($(this));
        });
    });
});

function monthlyReport(Obj1) {    
  //some transactions

  alert('test');    
}