Javascript 当选中单选按钮时，如何停止函数doajax_red和doajax_blue？

当选中单选按钮时，如何停止函数doajax_red和doajax_blue

首先，当您加载page index.php并按下红色按钮时，您将看到正在加载img

选中的单选按钮为蓝色，选中的单选按钮为红色

正在加载的img仍然显示，

当选中蓝色单选按钮时，如何停止函数doajax_red

当选中红色单选按钮时，停止函数doajax_blue

index.php

。

---

您应该为设置超时创建两个变量，如红色超时和蓝色超时。然后，在函数内部，在开始之前，您将检查是否存在其他超时，并使用clearTimeout阻止它，下面是代码：

var RED_TIMEOUT, BLUE_TIMEOUT;

function doajax_red() {
    $("#button_red").attr("disabled", true);
    $('#myplace_red').hide();
    $("#loading_red").show();

    if (BLUE_TIMEOUT!==undefined) clearTimeout(BLUE_TIMEOUT);
    // here ^ you stop the other function

    RED_TIMEOUT = setTimeout(function(){
        $.ajax({
            url: 'test_red.php',
            type: 'POST',
            data: $('#buy_out_form-id').serialize(),
            cache: false,
            success: function (data) {
                $("#loading_red").hide();
                $("#button_red").attr("disabled", false);
                $('#myplace_red').show();
                $('#myplace_red').html(data);
            }
        })
    }, 10000);
}

function doajax_blue() {
    $("#button_blue").attr("disabled", true);
    $('#myplace_blue').hide();
    $("#loading_blue").show();

    if (RED_TIMEOUT!==undefined) clearTimeout(RED_TIMEOUT);
    // here ^ you stop the other function

    BLUE_TIMEOUT = setTimeout(function(){
        $.ajax({
            url: 'test_blue.php',
            type: 'POST',
            data: $('#buy_out_form-id').serialize(),
            cache: false,
            success: function (data) {
                $("#loading_blue").hide();
                $("#button_blue").attr("disabled", false);
                $('#myplace_blue').show();
                $('#myplace_blue').html(data);
            }
        })
    }, 10000);
}

---

clearTimeout是您的朋友您应该在单击时禁用这两个按钮，并在成功时启用

var RED_TIMEOUT, BLUE_TIMEOUT;

function doajax_red() {
    $("#button_red").attr("disabled", true);
    $('#myplace_red').hide();
    $("#loading_red").show();

    if (BLUE_TIMEOUT!==undefined) clearTimeout(BLUE_TIMEOUT);
    // here ^ you stop the other function

    RED_TIMEOUT = setTimeout(function(){
        $.ajax({
            url: 'test_red.php',
            type: 'POST',
            data: $('#buy_out_form-id').serialize(),
            cache: false,
            success: function (data) {
                $("#loading_red").hide();
                $("#button_red").attr("disabled", false);
                $('#myplace_red').show();
                $('#myplace_red').html(data);
            }
        })
    }, 10000);
}

function doajax_blue() {
    $("#button_blue").attr("disabled", true);
    $('#myplace_blue').hide();
    $("#loading_blue").show();

    if (RED_TIMEOUT!==undefined) clearTimeout(RED_TIMEOUT);
    // here ^ you stop the other function

    BLUE_TIMEOUT = setTimeout(function(){
        $.ajax({
            url: 'test_blue.php',
            type: 'POST',
            data: $('#buy_out_form-id').serialize(),
            cache: false,
            success: function (data) {
                $("#loading_blue").hide();
                $("#button_blue").attr("disabled", false);
                $('#myplace_blue').show();
                $('#myplace_blue').html(data);
            }
        })
    }, 10000);
}