如何在javascript中调用单个ajax函数时停止其他ajax函数自动执行？答案

【问题标题】：How to stop other ajax functions executing automatically while calling single ajax function in javascript?如何在javascript中调用单个ajax函数时停止其他ajax函数自动执行？
【发布时间】：2015-07-31 11:31:18
【问题描述】：

我编写了用于在点击时从服务器获取数据的 ajax 函数。

流程

1) 浏览 -> 单击 -> 我们得到年份。 [工作]

2) 年 -> 点击 -> 我们得到月。 [工作]

3) 月 -> 点击 -> 我们得到那个月的星期。[工作]

这三个函数都从服务器获取数据。

但是当我点击年份来获取月份时，

2 个函数被触发

1) 获取我点击的月份。

2) 获取年份，仅由浏览链接调用（该函数自动调用）。所以在 get months 函数执行后再次调用 get year 函数。

同样，我有第三个函数，它返回该月的一周。当我点击任意月份获取星期时，会调用 3 个函数

1) 获得一周 - 点击时由我调用。

2) 获取月份 - 自动调用。

3) 获取年份 - 自动调用。

我在下面列出的 2 个函数

1) 获取年份 2) 获取月份

函数 getYears()

function getYears() {

        var ul = $('.panel-body ul');
        if (ul.length > 0) {
            ul.html('');
        }
        var liopen = '<li class="list-group-item"><a href="#" onclick="getMonths(this);">';
        var liclose = '</a></li>';

        //showing progress bar
        progress.fadeIn(500);

        $.ajax({
            type: "POST",
            url: "Test.aspx/loadYears",
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                progress.fadeOut(500);
                var obj = JSON.parse(data.d);
                console.log(obj);
                for (var i = 0; i < obj.length; i++) {
                    ul.append(liopen + obj[i] + liclose);


               }

            },
            error:function(errorData)
            {
                console.log(errorData.status);
            }
        });
    }

函数getMonths(目标)

function getMonths(target) {


        progress.fadeIn(500);
        var targetLink = $(target);
        var ifData = $(target).find('ul');
        if (ifData.length > 0) {
            ifData.html('');
        }
        var ul = $(document.createElement('ul'));

        var liopen = '<li><a href="#" onclick="getWeeks(this);">';
        var liclose = '</a></li>';
        var year = parseInt( $(target).text());
        $.ajax({
            type: "POST",
            url: "Test.aspx/loadMonths",
            data:'{year_ : "' + year + '"}',
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                progress.fadeOut(500);
                var obj = JSON.parse(data.d);
                console.log(obj);
                for (var i = 0; i < obj.length; i++) {
                    ul.append(liopen + obj[i] + liclose);


                }
                targetLink.append(ul);
                return true;
            },
            error: function (errorData) {
                console.log(errorData.status);
            }
        });
    }

浏览

<a href="#" style="z-index:3;color:grey" onclick="getYears();">Browse Site reports</a>

<ul class="list-group"><li class="list-group-item"><a href="#" onclick="getMonths(this);">2016</a></li></ul>

<ul><li><a href="#" onclick="getWeeks(this);">Jul</a></li></ul>

【问题讨论】：

能否请您也发布调用getYears() 的点击处理程序？
你能创建一个jsfiddle吗，jsfiddle.net
jsfiddle.net/rathore/y3o0ct1p ，我只是放了html代码。 @dreamweiver
您是否尝试将 async:false 添加到您的 ajax 调用中？
@Bardo 试过了，不工作..

标签： javascript jquery ajax

【解决方案1】：

问题是所有数据都附加到“a”标签本身。因此，如果我们点击嵌套在主标签本身中的 getMonths 函数，我们也在点击标签。如下代码：

<a click=func1();>
  <ul>
    <li>
      <a click=function2();>
      </a>
   </li>
  </ul>
</a>

问题已解决。

【讨论】：