JS雙重定時器之清空時間

 

關於雙重定時器跳轉要清空時間，但是具體在哪裡清空，還有清空為什麼沒有生效之前一直讓我苦惱，在網上找也根本找不到一個有意義的，還是詢問身邊的人才解決，下面說說我的方法：

                    <li>
                        <div class="name-title-f7poor-top10">
                            <h3>F7 AOI不良率TOP10</h3>
                            <a href="javascript:;" class="active" data-type="Pre" onclick="var xt = 'F7'; var productModel = 'Pre'; var rResult = 'FAIL'; getparamsF7PoorTop10(productModel, rResult,xt)">PRE</a>
                            <a href="javascript:;" data-type="Post" onclick="var xt = 'F7';var productModel = 'Post'; var rResult = 'FAIL'; getparamsF7PoorTop10(productModel, rResult,xt)">POST</a>
                        </div>
                        <div class="courserate-pre">
                            <div class="a">
                                <table class="sup1" width="100%">
                                    @*<table class="sup1" width="100%" style="font-size:8px;">*@
                                    <thead>
                                        <tr>
                                            <td>排名</td>
                                            <td>線體</td>
                                            <td>位號</td>
                                            <td>料號</td>
                                            <td>誤報數</td>
                                        </tr>

                                    </thead>

                                    <tbody id="sup1">
                                    </tbody>

                                </table>
                            </div>

                            <div class="b">
                                <table class="sub1" collapse="0">
                                    <thead>
                                        <tr>
                                            <td>誤報類型</td>
                                            <td>數量</td>
                                        </tr>

                                    </thead>
                                    <tbody id="sub1">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </li>
                    

 $('.border-container').on('click', '.name-title-f7poor a', function () {
            $(this).addClass('active').siblings('a').removeClass('active');
        });
        $('.border-container .name-title-f7poor a').eq(0).click();
        var indexF7Poor = 0;
        var timerf7poor = setInterval(function () {
            indexF7Poor++;
            if (indexF7Poor > 1) {
                indexF7Poor = 0
            };
            $('.border-container .name-title-f7poor a').eq(indexF7Poor).click();
        }, 22000);
 var timer1;
        function getparamsF7PoorTop10(productModel, rResult, xt) {
            clearInterval(timer1);
            $('.courserate-pre').off("mouseenter"); 
            $.ajax({
                url: "GetPREAndPOSTResult",
                type: "post",
                async: false,//ajax同步請求，默認true異步
                data: { "productModel": productModel,  "rResult": rResult ,"xt":xt},
                success: function (data) {
                    var json_data = JSON.parse(data.Result);
                    var itemxch = JSON.parse(json_data[0].ITEMXCH);
                    var itemntr = JSON.parse(json_data[0].ITEMNTR);
                    var arr_aaa = [];
                    var sup1 = ``;
                    var sub1 = ``;
                    if (itemxch.length > 0) {
                        for (var i = 0; i < itemxch.length; i++) {
                            sup1 += `<tr>
                                        <td>${itemxch[i].PH}</td>
                                        <td>${itemxch[i].LINE}</td>
                                        <td>${itemxch[i].COMPONENT_NAME}</td>
                                        <td>${itemxch[i].HH_PN}</td>
                                        <td>${itemxch[i].COUNTALL}</td>
                                     </tr>`;
                        }
                        for (var k = 0; k < itemntr.length; k++) {
                            var a = JSON.parse(itemntr[k].ALL);
                            arr_aaa.push(a);
                        }
                         //if (arr_aaa.length > 0) {
                        $('.courserate-pre').on('mouseenter', 'tbody tr', function () {
                            sub1 = ``;
                            $(this).addClass('active').siblings().removeClass('active');
                            var data_arr = arr_aaa[$(this).index()];
                            var flag = isStringType(data_arr);
                            if (!flag && (typeof (data_arr) != "undefined")) {
                                for (var m = 0; m < data_arr.length; m++) {
                                    sub1 += `<tr>
                                    <td>${data_arr[m].NG_DEFECTS}</td>
                                    <td>${data_arr[m].COUNTSOME}</td>
                                      </tr>`;
                                }
                            } else {
                                sub1 = arr_aaa[$(this).index()];
                            }
                            arr_aaa[$(this).index()] = sub1;
                            $('#sub1').html(sub1);
                        });
                        let index = 0;
                        timer1 = setInterval(() => {
                            $('.courserate-pre tbody tr').eq(index).mouseenter();
                            index++;
                            if (index > 9) {
                                index = 0;
                            }
                        }, 2000);
                        //}
                    } else {
                        sup1 = `<td></td>
                        <td></td>
                        <td></td>
                        <td style="font-size:16px;color:pink;padding-top:100px;">暫無數據</td>`;
                    }
                    $('#sub1').html(sub1);
                    $('#sup1').html(sup1);
                }
            })
        }

 1.第二個定時器一定要是全局變量，才能在第一層定時器跳轉的時候清空

2.一定要記得跳轉頁面後要記得清理頁面

clearInterval(timer1);
$('.courserate-pre').off("mouseenter");