在重新加载局部视图之前停止匿名函数

Question

我有一个部分视图，其内容正在不断更新。当部分视图被AJAX调用替换时，其中两个JQuery方法将同时针对相同的id或类运行。这将彻底弄乱结果。

举个例子

<div id="testDiv"></div>
<script type="text/javascript">
    $(function(){
        testfunc();
    };

    function testfunc(){
        $.ajax({
                    type: 'GET',
                    url: 'Test/TestMethod'
                })
                .done(function(data) {
                    $("#testDiv").replaceWith(data);
                });
    }
</script>

正在退回的部分视图

<div id="testDiv">100</div>
<script type="text/javascript">
    $(function(){
        setInterval(function(){
            var value = $("#testDiv").text();
            var num = parseInt(value);
            var newNum = num + 1;
            $("#testDiv").html(newNum);
        }, 1000);
    };
</script>

还有一个调用testfunc()调用的按钮，它只会替换该部分视图，但这两种方法都会改变div的html。如何在刷新局部视图时停止第一个功能。

更新 -

如果在加载页面后调用testfunc()，将重新创建setInterval中的匿名函数，并且两个函数将同时运行。示例页面加载后30秒内部数字将为130，但如果您调用testfunc()，则在更换部分后将显示两个计数。我需要完全停止第一种方法。